是否可以一次为元素的所有事件分配防止默认值？

Question

可能重复:
jQuery - 如何绑定DOM元素上的所有事件？

想象一下,如果我们想让一些元素完全不可分割.

当然,我们可以为click事件绑定一个防止默认值,如下所示:

$('form *').bind('click', function(event) {
    event.preventDefault();
});

但这只是一个事件,还有更多,如悬停,焦点,选择启动等等.

我们可以指定他们都在像"点击重点悬停DBLCLICK模糊选择开始"一条线,但是这并没有太大的意义,是不容易保持.

那么,是否可以绑定事件监听器而不区分事件的类型？也许一些原生的JavaScript听众允许它？

Answer 1

在考虑了所有选项之后，对于所有这些活动的喧嚣来说，它看起来仍然不方便。由于它还必须单独绑定每个事件的处理程序，因此脚本也会影响性能。

我将坚持使用一个更简单的解决方案，只需在顶部放置一个带有透明背景的 div 来覆盖我们的元素。

$('form').css('position','relative').prepend($('<div class="mask" style="position:absolute;z-index:9000;height:100%;width:100%;background-image:url(1px_transparent.png);"></div>'));

这将自动填充元素的整个区域，或者，我们可以使用半透明图片，这样用户也会明白这是锁定的元素，并且不会造成混乱。

要解锁，我们只需从元素中删除 .mask div 即可。

编辑

新小提琴：http://jsfiddle.net/YAdXk/8/

实际上我们可以通过将tabindex属性设置为来禁用选项卡-1

.find('input,textarea,select').attr('tabindex','-1');

更新后的小提琴也可以防止制表符。

编辑2

或者，我们可以扩展 jQuery 以在任何元素上使用我们的自定义lock()和unlock()函数。

请参阅最后一个小提琴：http://jsfiddle.net/YAdXk/13/

(function($) {
$.fn.lock= function() {
    return this.each(function() {
        $(this).css('position','relative').prepend($('<div class="mask" style="position:absolute;z-index:9000;height:100%;width:100%;background-image:url('+transparent_picture+');"></div>')).find('input,textarea,select').attr('tabindex','-1');
    });
};   

$.fn.unlock= function() {
    return this.each(function() {
        $(this).find('*').removeAttr('tabindex').filter('.mask').remove();
   });
};

})( jQuery )