当我们想将任何事件绑定到一个元素时,通常我们可以使用on()方法直接绑定到每个元素的任何事件。
示例 1:此示例使用 jQuery on() 方法动态添加段落元素。
How to handle events in dynamically
created elements in jQuery?
- Click here to append !!!
输出:
这非常有效,但是当我们添加一个新的列表项并单击它时,什么也没有发生。这是因为之前附加的事件处理程序在加载文档时执行。当时只有第一个列表项存在,而不是新的。因此.on()方法仅应用于第一个列表项,而不应用于其余项。
示例 2:以下示例是使用on()方法实现的。
How to handle events in dynamically
created elements in jQuery?
- Click here to check on()!!!
输出:
示例 3:以下示例是使用delegate()函数的。要将事件处理程序绑定到动态创建的元素,我们将使用事件委托。单击新列表项时,将执行相同的操作。
事件委托是允许我们将单个事件侦听器附加到父元素的过程,它将为现在存在或将来添加的所有子元素触发。 on()和delegate()函数都允许我们进行事件委托。
How to handle events in dynamically
created elements in jQuery?
- Click to check delegate !!!
输出: