我是否必须为每个表单元素添加一个处理程序，以阻止keyup事件冒泡到父div

Question

如何避免手动向每个表单元素添加处理程序，而是在代码中设置一些默认值，以便一组表单元素(在示例中当前由class="preventbubbling"标记，但也欢迎其他机制，如custom elements(默认情况下防止冒泡？

<script>function react(ev,el) {console.log(ev);} </script>
<div name="dialog" onkeyup="react(event,this);">
<textarea class="allowbubbling"></textarea> 
<textarea class="preventbubbling"></textarea>
and many other form elements inputs etc
</div>

在文本区域中键入还会触发div的onkeyup。

有没有一种简单的方法可以让一些表单元素允许冒泡，还有一些可以默认防止冒泡？

附言：除了简单的方法外，创建自定义元素在当前主流浏览器上是否足够好？

Answer 1

Event.stopPropagation()就是您所需要的。

如果您不希望textareakeyup事件冒泡到div，那么您需要这样的东西：

<script>function react(ev,el) {console.log(ev);} </script>
<div name="dialog" onkeyup="react(event,this);">
<textarea class="allowbubbling"></textarea> 
<textarea class="preventbubbling" onkeyup="event.stopPropagation()"></textarea>
and many other form elements inputs etc
</div>

Answer 2

不，您没有。

可以通过在内部元素的事件中调用event.stopPropagation()来停止传播。