Question

我有一个主页面（main.html），它打开一个iframe页面（iframe.html）.. iframe被附加为main.html上的一种厚盒窗口。现在这个iframe.html上有一个div元素“myDiv”，我需要检测这个myDiv元素之外的点击..

该脚本是在iframe.html中调用的JS中编写的

我已经尝试了一些事情（绑定事件来记录和从myDiv中删除），但这不起作用..

$(document).click(function() {
  //your code here
});

$("#myDiv").unbind("click");

由于iframe，我不确定这个问题是否有任何关系......

请帮帮我。谢谢。

Answer 1

你尝试过这样的事吗？它会侦听文档的所有点击，但只有在事件的目标不是myDiv元素时才会触发您的代码。这样，您可以判断点击是否在myDiv元素之外....我使用了jQuery：

// assign a document listener $(document).click(function(e){



if( $(e.target).attr('id') != "myDiv" )
{
  // execute your code here
  alert( e.target );        }
});

// assign an element listener
$('#myDiv').live('click',function(){alert("clicked on myDiv")});

if( $(e.target).attr('id') != "myDiv" ) { // execute your code here alert( e.target ); } }); // assign an element listener $('#myDiv').live('click',function(){alert("clicked on myDiv")});

如果用户直接点击myDiv元素，它还允许您将特定代码分配给myDiv元素...

Answer 2

我认为如果你点击它之外你想隐藏myDiv，试试这个。

$(document).click(function() {
  $("#myDiv").hide();
});

$("#myDiv").click(function(e){
  e.stopPropagation();
});

Answer 3

这是我所谈论的“旗帜和忽略”例程。我希望有一个jQuery本地方法来做到这一点，因为使用这样的标志是一个肮脏的黑客IMO

var myDiv = false;
$(document).click(function() {
  if (!myDiv) {
    // your code here
  }
  myDiv = false;
});

$("#myDiv").click(function(e){
  myDiv = true;
  return false; // don't know if returning false will stop propagation in jQuery
});

检测元素外部的单击（带框架）

3 个答案: