jquery 屏蔽一个区域内的所有元素，禁止输入
更新时间：2009年10月22日 13:20:48 作者：
有时候，需要屏蔽一个div中所有的input类型，使用jquery很简单有效的完成。
jquery 扩展函数：
<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>
结果不是很美观，但是还是蛮有效。
当然美观的方式是在上面建立一个图层进行屏蔽。
复制代码 代码如下:
<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>
结果不是很美观，但是还是蛮有效。
当然美观的方式是在上面建立一个图层进行屏蔽。
您可能感兴趣的文章:
相关文章
jQuery+ThinkPHP+Ajax实现即时消息提醒功能实例代码
这篇文章主要介绍了jQuery+ThinkPHP+Ajax实现即时消息提醒功能的实例代码，非常不错，具有参考借鉴价值，需要的朋友参考下2017-03-03
本文介绍了使用jQuery、PHP和MySQL实现类似360安全卫士防火墙开启关闭的开关，可以将此功能应用在产品功能的开启和关闭功能上,需要的朋友可以参考下2014-02-02
这篇文章主要介绍了jQuery使用$.each遍历json数组的简单实现方法,结合实例形式分析了each方法遍历json数组的实现技巧与相关注意事项,需要的朋友可以参考下2016-04-04
我们就中和下利用JQuery来和他一个table里面相同内容的单元格，这里代码跟大家分享下，希望对大家有用2011-01-01
这篇文章主要介绍了基于Jquery代码实现手风琴菜单，代码简单易懂，需要的朋友参考下2015-11-11
选择器的意义就是将众多html代码中准确的找出我们想找的单元。接下来将常见的选择器以及作用列举出来，对jQuery常见的选择器及用法感兴趣的朋友一起看看吧2016-12-12
在toggle()方法中，可以依次调用N个指定的函数，直到最后一个函数，然后重复对这个函数轮番调用,在函数之间切换调用的时候相当的方便,接下来将会详细介绍toggle()方法的使用，感兴趣的你可不要错过了啊2013-02-02
这篇文章主要介绍了使用jQuery UI库开发Web界面的简单入门指引,jQuery UI是一个基于jQuery的图形组件库,需要的朋友可以参考下2016-04-04
jQuery插件DataTable使用方法详解(.Net平台)
这篇文章主要为大家详细介绍了jQuery插件DataTable使用方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-12-12
这个简化版不能在别的框架弹出层的，所以也就没有了那个cssurl属性了，也没有target 属性了2008-10-10
最新评论