Div onclick功能未按预期运行

时间:2015-09-22 16:15:03

标签: jquery html onclick

我试图运行一个在网页上的任何位置点击时都会激活的功能。

为了达到这个目的,我创建了一个填充整个网页的div,并设置了一个onclick命令,但单击div时没有响应。

当我在' onclick'中使用它时,完全相同的功能有效。在按钮上,我做错了什么?

<div id='target' onclick="getStatus()"> <button onclick="getStatus()">Start</button>

先谢谢。

1 个答案:

答案 0 :(得分:1)

您可以使用vanilla javascript来实现点击效果。这是一个小提琴 http://jsfiddle.net/hjamal/16geab29/

传递的Mouse事件具有srcElement属性,因此您可以控制在用户按下内部元素或外部元素时是否作出反应。

您也可以使用document.addEventListener('click', callback)代替创建包装整个文档的div来监听整个文档中的点击,并使用与上面相同的技巧使其对文档中的每个元素的行为不同。

如果您在此页面上提取您的开发人员控制台以获取示例并复制此代码,则应该获得与您希望的类似的行为。

document.addEventListener('click', function(event){
  var source =  event.srcElement || event.target;  
  console.log(source)
})

请注意,srcElement在任何地方都没有标准化。旧版本的IE也使用目标。要了解更多信息,请查看以下内容:

https://developer.mozilla.org/en-US/docs/Web/API/Event/srcElement https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent

https://developer.mozilla.org/en-US/docs/Web/API/Event