jquery 屏蔽一個區(qū)域內(nèi)的所有元素，禁止輸入
更新時間：2009年10月22日 13:20:48 作者：
有時候，需要屏蔽一個div中所有的input類型，使用jquery很簡單有效的完成。
jquery 擴展函數(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)然美觀的方式是在上面建立一個圖層進行屏蔽。
復(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)然美觀的方式是在上面建立一個圖層進行屏蔽。
您可能感興趣的文章:
相關(guān)文章
jQuery+ThinkPHP+Ajax實現(xiàn)即時消息提醒功能實例代碼
這篇文章主要介紹了jQuery+ThinkPHP+Ajax實現(xiàn)即時消息提醒功能的實例代碼，非常不錯，具有參考借鑒價值，需要的朋友參考下2017-03-03
使用jQuery和PHP實現(xiàn)類似360功能開關(guān)效果
本文介紹了使用jQuery、PHP和MySQL實現(xiàn)類似360安全衛(wèi)士防火墻開啟關(guān)閉的開關(guān)，可以將此功能應(yīng)用在產(chǎn)品功能的開啟和關(guān)閉功能上,需要的朋友可以參考下2014-02-02
jQuery使用$.each遍歷json數(shù)組的簡單實現(xiàn)方法
這篇文章主要介紹了jQuery使用$.each遍歷json數(shù)組的簡單實現(xiàn)方法,結(jié)合實例形式分析了each方法遍歷json數(shù)組的實現(xiàn)技巧與相關(guān)注意事項,需要的朋友可以參考下2016-04-04
基于JQuery實現(xiàn)相同內(nèi)容合并單元格的代碼
我們就中和下利用JQuery來和他一個table里面相同內(nèi)容的單元格，這里代碼跟大家分享下，希望對大家有用2011-01-01
這篇文章主要介紹了基于Jquery代碼實現(xiàn)手風(fēng)琴菜單，代碼簡單易懂，需要的朋友參考下2015-11-11
選擇器的意義就是將眾多html代碼中準(zhǔn)確的找出我們想找的單元。接下來將常見的選擇器以及作用列舉出來，對jQuery常見的選擇器及用法感興趣的朋友一起看看吧2016-12-12
JQuery入門——事件切換之toggle()方法應(yīng)用介紹
在toggle()方法中，可以依次調(diào)用N個指定的函數(shù)，直到最后一個函數(shù)，然后重復(fù)對這個函數(shù)輪番調(diào)用,在函數(shù)之間切換調(diào)用的時候相當(dāng)?shù)姆奖?接下來將會詳細(xì)介紹toggle()方法的使用，感興趣的你可不要錯過了啊2013-02-02
使用jQuery UI庫開發(fā)Web界面的簡單入門指引
這篇文章主要介紹了使用jQuery UI庫開發(fā)Web界面的簡單入門指引,jQuery UI是一個基于jQuery的圖形組件庫,需要的朋友可以參考下2016-04-04
jQuery插件DataTable使用方法詳解(.Net平臺)
這篇文章主要為大家詳細(xì)介紹了jQuery插件DataTable使用方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-12-12
這個簡化版不能在別的框架彈出層的，所以也就沒有了那個cssurl屬性了，也沒有target 屬性了2008-10-10