Question

嗨，我有一个表格的div。我希望当鼠标不在div时禁用点击事件。所以我尝试了这个，但它不工作的div仍然是可点击的。有什么想法??

var flag = false;
$("#foo").live("mouseenter",function(){
    flag = true;
}).live("mouseleave",function(){
    flag = false;
})

$(document).click(function(){
    if(!flag)
         return false;
});

Answer 1

您无法阻止从整个文档触发的click事件。你可以按元素进行。您可以使用绝对定位透明（低不透明度）div来阻挡整个屏幕，并在div可见时再次隐藏它。

var $body = $(document.body);
var $div = $("<div id='dummyDiv'/>").hide().appendTo($body);
$div.css({position:"absolute", height: $body.height(), width: $body.width(), background: "#000", opacity: 0.5}).show(100);

//to hide it
$("#dummyDiv").hide(100);

Answer 2

$("#foo").live("mouseenter",function(){
    $(document).bind('click', onDocumentClick);
}).live("mouseleave",function(){
    $(document.unbind('click');
});

function onDocumentClick(e){

};

我认为您希望点击#foo而不是document，如果是这样，您可以直接执行此操作：

$('#foo').click(function(){

});

由于你必须翻阅一个元素才能点击它，这样可以正常工作。

Answer 3

而不是使用return false，请使用e.preventDefault http://css-tricks.com/6809-return-false-and-prevent-default/

超出div时禁用鼠标单击

3 个答案: