编程语言
首页 > 编程语言> > 用javascript模拟o​​nclick事件

用javascript模拟o​​nclick事件

作者：互联网

我想做的是将一个imagebutton放在比按钮本身宽的div中,当单击外部div时,我希望调用image button的onclick()函数.我从html代码下面期望的是,当我单击按钮本身时,它应该仅警告“单击按钮”.当我单击外部div时,它应该先警告“ div clicked”,然后“ button clicked”.问题是,当我单击div时,它会发出警报：依次“依次单击div”,“单击按钮”和“ div单击”.当我单击按钮时,它会发出警报：“单击按钮”,然后“单击div”,然后单击“按钮”,然后单击“ div”.

我找不到我在这里缺少的东西,有什么帮助吗？

<html>
<body>
    <div style="width: 200px; border: 1px solid red;" onclick="alert('div clicked');(document.getElementById('addButton')).click();">
        <input type="button" onclick="alert('button clicked');"
            id="addButton"/>
    </div>
</body>
</html>

解决方法:

您所错过的是,某些事件在文档树中冒出,触发了父元素的所有单击处理程序.要停止它,请在事件对象上调用stopPropagation.

<input type="button" onclick="event.stopPropagation ? event.stopPropagation() : (event.cancelBubble=true);alert('button clicked');"
        id="addButton"/>

(在旧版IE中,没有stopPropagation,您需要设置event.cancelBubble = true)

标签：click,simulate,javascript
来源： https://codeday.me/bug/20191201/2079521.html