使用jquery的blockui外掛程式顯示彈出層

2021-08-28 15:42:50 字數 808 閱讀 2466

在做**的開發過程中,可能需要使用彈出層,使用jquery的blockui外掛程式可以很輕鬆的實現這個效果。blockui可以在你傳送ajax請求的時候,顯示乙個遮罩層禁止使用者對頁面進行操作並顯示提示資訊;或者用來顯示乙個登陸視窗,也可用來顯示等。

blockui外掛程式主要使用blockui和unblockui兩個方法來控制彈出層的顯示或者隱藏,可以在blockui方法中指定一些引數,來控制彈出層顯示的內容,大小,位置等。blockui方法的常用的引數有:message,css,overlaycss,showoverlay。

message:主要用來設定要顯示的內容,可以直接設定為一段文字,html**或者使用jquery獲取頁面上隱藏的div。

css:主要用來設定彈出層的樣式,包括彈出層的位置,大小,邊框等。

overlaycss:主要用來設定遮罩層的樣式,包括背景色,透明度等。

showoverlay:主要用來設定是否顯示遮罩層,如果要隱藏遮罩層可以設定為false。

下面通過一些例子來看看具體的用法,在頁面匯入jquery.min.js和jquery.blockui.js檔案,具體實現**如下:

$("#btnsubmit").click(function ()

});});

$("#btnlogin").click(function ()

});settimeout(function () , 1000);

});$("#btncancel").click(function () );

對應的html**為:

使用者名稱:

密 碼:

jquery高階頁面元件:

強大的jQuery彈出層外掛程式 BlockUI

經常會有些同志問我有沒有好用的基於jquery的彈出層外掛程式,我通常都會毫不猶豫的推薦他這款外掛程式 blockui。我也極少接觸到其他的jquery彈出層外掛程式,因為我覺得有了blockui這款功能強大的外掛程式已經能滿足我的需求了。先看看blockui的演示效果 檢視演示 blockui支援...

jQuery使用 jQuery語法

今天我們就來看一下jquery語法。通過 jquery,可以選取 selector html 元素,並對它們執行 操作 actions 基礎語法 selector action 美元符號 定義 jquery 選擇符 selector 查詢 和 查詢 html 元素 jquery 的 action 執...

jquery的ajax,post,get使用小計1

近日,自己寫了乙個使用者許可權列表配置管理。在使用者角色列表發生變化時,自己繪製的許可權樹的checkbox checked屬性則發生變化。結果用 post,ie是正常使用,chrome死活不行。就是不重新整理。分析發現dealtext在chrome返回值時沒有得到我要的結果。難道是非同步同步的問題...