本文實例講述了jQuery動態(tài)生成的元素綁定事件操作。分享給大家供大家參考，具體如下：

這段時間在寫代碼的時候遇到一個問題，通過append()添加的節(jié)點，點擊事件不起作用。當時我百思不得其解，各種找錯都沒找到錯誤的原因。后來才發(fā)現(xiàn)是動態(tài)生成節(jié)點的問題，還是自己沒有經(jīng)驗啊。

下面來總結(jié)一下這個問題的始末，溫故而知新。

先看下click綁定事件的效果。

<div>    <p>a</p>    <p>b</p>    <p>c</p></div>

創(chuàng)建一個按鈕來生成新的節(jié)點p

<button>create</button>

綁定點擊事件

<script>    //添加點擊事件    $("p").click(function(){        $(this).text('click');    })    //創(chuàng)建一個新節(jié)點    $("button").click(function(){        var p ="<p>new</p>";        $("div").append(p);    })</script>

點擊第一p元素，事件生效，運行結(jié)果：

點擊按鈕，生成新的節(jié)點，并點擊新的節(jié)點，運行結(jié)果：

結(jié)果證明，click并沒有綁定到新的節(jié)點上。

如果需要給動態(tài)的元素綁定事件，需要使用到on()。

$("div").on("click","p",function(){    $(this).text('click');})

on()方法，可以給未來的元素綁定事件

使用方法：

1、先選中動態(tài)生成元素的父元素
2、然后綁定事件
3、再選中子類

可以理解為給div下的p元素包括未來的p元素綁定click事件,這是比較通俗易懂的理解，詳細內(nèi)容可以看文檔的具體說明

更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《jQuery常見事件用法與技巧總結(jié)》、《jQuery常用插件及用法總結(jié)》、《jQuery操作json數(shù)據(jù)技巧匯總》、《jQuery擴展技巧總結(jié)》、《jQuery常見經(jīng)典特效匯總》及《jquery選擇器用法總結(jié)》

希望本文所述對大家jQuery程序設計有所幫助。