Question

我想编写一个事件监听器函数，当我的<ul>标记中的任何元素被编辑时都需要调用。
例如，对于给定ul

中的元素

<ul class="container">
  <h4 contenteditable="true">hi</h4>
  <h5 contenteditable="true">hi</h5>
  <label>
    <input id="indeterminate-checkbox" type="checkbox" />
    <span contenteditable="true">Indeterminate Style</span>
  </label>
  <p contenteditable="true">hi</p>
  <blockquote contenteditable="true">sup</blockquote>
</ul>

我只想使用element.addEventListener()一次（我不能只声明ul的内容可编辑，并为其添加侦听器，因为这样会导致不良的UI更改）。另外，如果可能的话，我想一次为所有这些元素声明onchange（例如css中的声明）。

我要这样做是因为我正在动态添加元素，并希望删除多余的代码。

Answer 1

在这里查看第二个答案：trigger an event when contenteditable is changed 您可以对ul内部的所有contenteditable元素执行此操作

$( "ul.container" ).on( "focus", "[contenteditable=true]", function() {
  //here you save the content innerhtml/text, etc of the element
});

然后使用“ blur”事件，当您离开一个元素时，您可以测试旧内容是否相同，然后执行一些操作。有关“ on” jquery函数的参考：http://api.jquery.com/on/

如何一次为特定标记中的所有元素编写事件侦听器？

1 个答案: