亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

jQuery動(dòng)態(tài)生成的元素綁定事件操作實(shí)例分析

 更新時(shí)間:2019年05月04日 17:49:17   作者:無痕之意  
這篇文章主要介紹了jQuery動(dòng)態(tài)生成的元素綁定事件操作,結(jié)合實(shí)例形式分析了jQuery事件綁定的原理及動(dòng)態(tài)生成的元素綁定事件相關(guān)操作技巧,需要的朋友可以參考下

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

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

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

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

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

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

<button>create</button>

綁定點(diǎn)擊事件

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

點(diǎn)擊第一p元素,事件生效,運(yùn)行結(jié)果:

點(diǎn)擊按鈕,生成新的節(jié)點(diǎn),并點(diǎn)擊新的節(jié)點(diǎn),運(yùn)行結(jié)果:

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

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

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

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

使用方法:

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

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

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

希望本文所述對(duì)大家jQuery程序設(shè)計(jì)有所幫助。

相關(guān)文章

最新評(píng)論