jquery 屏蔽一個(gè)區(qū)域內(nèi)的所有元素,禁止輸入
更新時(shí)間:2009年10月22日 13:20:48 作者:
有時(shí)候,需要屏蔽一個(gè)div中所有的input類型,使用jquery很簡單有效的完成。
jquery 擴(kuò)展函數(shù):
<script type="text/javascript">
(function($) {
$.fn.disable = function() {
/// <summary>
/// 屏蔽所有元素
/// </summary>
/// <returns type="jQuery" />
return $(this).find("*").each(function() {
$(this).attr("disabled", "disabled");
});
}
$.fn.enable = function() {
/// <summary>
/// 使得所有元素都有效
/// </summary>
/// <returns type="jQuery" />
return $(this).find("*").each(function() {
$(this).removeAttr("disabled");
});
}
})(jQuery);
</script>
使用方式:裝載立即屏蔽:
<script type="text/javascript">
$(document).ready(function() {
$("#div_test").disable();
});
</script>
結(jié)果不是很美觀,但是還是蠻有效。
當(dāng)然美觀的方式是在上面建立一個(gè)圖層進(jìn)行屏蔽。
復(fù)制代碼 代碼如下:
<script type="text/javascript">
(function($) {
$.fn.disable = function() {
/// <summary>
/// 屏蔽所有元素
/// </summary>
/// <returns type="jQuery" />
return $(this).find("*").each(function() {
$(this).attr("disabled", "disabled");
});
}
$.fn.enable = function() {
/// <summary>
/// 使得所有元素都有效
/// </summary>
/// <returns type="jQuery" />
return $(this).find("*").each(function() {
$(this).removeAttr("disabled");
});
}
})(jQuery);
</script>
使用方式:裝載立即屏蔽:
復(fù)制代碼 代碼如下:
<script type="text/javascript">
$(document).ready(function() {
$("#div_test").disable();
});
</script>
結(jié)果不是很美觀,但是還是蠻有效。
當(dāng)然美觀的方式是在上面建立一個(gè)圖層進(jìn)行屏蔽。
相關(guān)文章
jQuery+ThinkPHP+Ajax實(shí)現(xiàn)即時(shí)消息提醒功能實(shí)例代碼
這篇文章主要介紹了jQuery+ThinkPHP+Ajax實(shí)現(xiàn)即時(shí)消息提醒功能的實(shí)例代碼,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友參考下2017-03-03
使用jQuery和PHP實(shí)現(xiàn)類似360功能開關(guān)效果
本文介紹了使用jQuery、PHP和MySQL實(shí)現(xiàn)類似360安全衛(wèi)士防火墻開啟關(guān)閉的開關(guān),可以將此功能應(yīng)用在產(chǎn)品功能的開啟和關(guān)閉功能上,需要的朋友可以參考下2014-02-02
jQuery使用$.each遍歷json數(shù)組的簡單實(shí)現(xiàn)方法
這篇文章主要介紹了jQuery使用$.each遍歷json數(shù)組的簡單實(shí)現(xiàn)方法,結(jié)合實(shí)例形式分析了each方法遍歷json數(shù)組的實(shí)現(xiàn)技巧與相關(guān)注意事項(xiàng),需要的朋友可以參考下2016-04-04
基于JQuery實(shí)現(xiàn)相同內(nèi)容合并單元格的代碼
我們就中和下利用JQuery來和他一個(gè)table里面相同內(nèi)容的單元格,這里代碼跟大家分享下,希望對大家有用2011-01-01
基于Jquery代碼實(shí)現(xiàn)手風(fēng)琴菜單
這篇文章主要介紹了基于Jquery代碼實(shí)現(xiàn)手風(fēng)琴菜單,代碼簡單易懂,需要的朋友參考下2015-11-11
JQuery入門——事件切換之toggle()方法應(yīng)用介紹
在toggle()方法中,可以依次調(diào)用N個(gè)指定的函數(shù),直到最后一個(gè)函數(shù),然后重復(fù)對這個(gè)函數(shù)輪番調(diào)用,在函數(shù)之間切換調(diào)用的時(shí)候相當(dāng)?shù)姆奖?接下來將會詳細(xì)介紹toggle()方法的使用,感興趣的你可不要錯(cuò)過了啊2013-02-02
使用jQuery UI庫開發(fā)Web界面的簡單入門指引
這篇文章主要介紹了使用jQuery UI庫開發(fā)Web界面的簡單入門指引,jQuery UI是一個(gè)基于jQuery的圖形組件庫,需要的朋友可以參考下2016-04-04
jQuery插件DataTable使用方法詳解(.Net平臺)
這篇文章主要為大家詳細(xì)介紹了jQuery插件DataTable使用方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-12-12

