首頁 > web前端 > js教程 > 主體

如何在 jQuery 中動態綁定 Onclick 事件到新增的 HTML 元素?

Patricia Arquette
發布: 2024-11-10 21:41:03
原創
744 人瀏覽過

How to Dynamically Bind Onclick Events to Added HTML Elements in jQuery?

新增HTML元素動態綁定Onclick事件

使用jQuery動態新增元素到網頁時,需要確保功能綁定點擊正常。但是,.bind() 和 .live() 等舊方法已被棄用。相反,應該使用 .on() 方法。

.on()方法採用三個參數:事件類型(例如「click」)、標識事件應發送到的元素的選擇器被綁定,以及處理的回呼函數event.

範例:

$(document).on('click', '.added-element', function() {
    alert('Hello from the binded event!');
});
登入後複製

在此範例中,任何具有「added-element」類別的元素在單擊時都會觸發警報,無論它是否已新增至DOM

注意:

.on() 方法也可用來將事件綁定到特定容器內動態新增的元素。例如,如果要將點擊事件綁定到 ID 為「container」的 div 中的所有元素,則可以使用以下程式碼:

$('#container').on('click', '.added-element', function() {
    alert('Hello from the container!');
});
登入後複製

以上是如何在 jQuery 中動態綁定 Onclick 事件到新增的 HTML 元素?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板