如何注册div点击事件？

我想为我的div注册clickevent。如果我把iframe放在div里面，它不会工作。如果它在外面，它会起作用。如何在iframe位于div内时使其工作？如何注册div点击事件？

HTML：

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <style> 
     #mydiv 
     { 
      height: 300px; 
      width: 300px; 
      border: 1px solid; 
     } 
    </style> 
    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 
    <script> 

     $(function() { 
      var clicks = 0; 
      $('#mydiv').bind('click', function (e) { 
       clicks++; 
       $("#numberclicks").html(clicks); 
      }); 
     }); 

    </script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
     <span id="numberclicks"></span> 
     <div id="mydiv"> 
      <iframe id="myframe" src="http://www.jquery.com" width="300" height="300" /> 
     </div> 


    </div> 
    </form> 
</body> 
</html>

来源

2011-11-28 Pindakaas

iframe是一个完全不同的DOM文档，这就是为什么当你点击DIV时，浏览器实际上是渲染iframe内容的点击，你可以在iframe上放置一个空div来模仿，会是这样的：

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <style> 
     #mydiv 
     { 
      height: 300px; 
      width: 300px; 
      border: 1px solid; 
     } 

     #clickerDiv 
     { 
      height: 300px; 
      position: absolute; 
      width: 300px; 
     } 
    </style> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
    <script> 

     $(function() { 
      var clicks = 0; 
      $('#mydiv').bind('click', function (e) { 
       clicks++; 
       $("#numberclicks").html(clicks); 
      }); 
     }); 

    </script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
     <span id="numberclicks">0</span> 
     <div id="mydiv"> 
      <div id="clickerDiv"></div> 
      <iframe id="myframe" src="http://www.jquery.com" width="300" height="300" /> 
     </div> 
    </div> 
    </form> 
</body> 
</html>

您可以将点击事件链接到幻影div，甚至链接到主div容器！

来源

2011-11-28 23:27:57

确定它计数点击，但iframe中的所有链接现在不起作用吗？我想both！ – Pindakaas

对不起，你不能拥有这两件事，或者你应该直接在ifram上阅读，你有没有访问iframe Source？ –

IFrame所吞咽的DIV作为一个跨站脚本的事情点击事件，你可以做什么用的z-index和收集被放在一个div在iframe的顶部点击从上面的div。

来源

2011-11-28 23:18:36

尝试不起作用:( – Pindakaas

这是因为实际的点击事件来到iframe的内容，这是一个完全不同的文档。为了处理这些问题，您必须附加到该文档的点击事件。

来源

2011-11-28 23:19:24

所有的答案都是正确的 - IFRAME创建一个新的窗口对象。您正在连接到父窗口中的“#mydiv”元素，而不是您的IFRAME的窗口。当DIV中发生点击事件时，它会通过DOM树“冒泡”。假设事件不是从冒泡中“停止”的，你可以在任何DIV的父元素中捕获和处理事件。但是，因为它位于IFRAME中，所以它将停止在文档级别冒泡，并且不会继续在父框架中冒泡。

现在，如果IFRAME与父框架位于同一个域中，则可以访问该文档的元素并将事件处理程序连接到这些元素。但是，您似乎在跨域违反“同源策略”的工作：http://code.google.com/p/browsersec/wiki/Part2#Same-origin_policy_for_DOM_access

来源

2011-11-28 23:32:48 thesmart

如何注册div点击事件？

回答

相关问题