在Div中禁用鼠标和键事件

Question

我有多个Html元素div.有没有办法禁用该Div的鼠标和键事件(不是针对单个元素)？元素是自动生成的,并且位于多个跨度内.因此我只想禁用整个div,以便不能改变任何东西readonly.

Answer 1

尝试使用.unbind()之类的

$('#my_div_id').unbind();

它将删除将附加到该div的所有事件.请参阅此UNBIND

你也可以使用.die

$('#my_div_id').die();

Answer 2

根据jQuery文档,unbind方法从元素中删除以前附加的事件处理程序.我的理解是您只想阻止触发默认浏览器事件,而不是删除以前附加的事件.

有一个简单的CSS解决方案,它不适用于IE10及以下:

#yourDiv {pointer-events:none;}

使用jQuery的解决方案是向div添加一个事件,然后防止在您选择的事件上发生默认行为:

$('#yourDiv').click(function(e){
    e.preventDefault();    
});

单击事件也适用于键盘访问复选框和单选按钮,但是如果您需要,例如,阻止输入字段上的文本输入,只需将键盘事件添加到列表:

$('#yourDiv').click(function(e){
    e.preventDefault();    
});
$('#yourDiv').keypress(function(e){
    e.preventDefault();
});

我只是发布这个答案,因为它可能会帮助其他人寻找类似的功能,但我相信有更好的方法来做你的情况.您可以运行一个函数,$('#yourDiv input').prop("disabled", true);在加载后将元素设置为禁用.很难说不知道你的HTML.