jquery append 動(dòng)態(tài)添加的元素事件on 不起作用的解決方案
用jquery添加新元素很容易,面對(duì)jquery append 動(dòng)態(tài)添加的元素事件on 不起作用我們?cè)撊绾谓鉀Q呢?on方法中要先找到原選擇器(如例.info),再找到動(dòng)態(tài)添加的選擇器(如列.delete)。
具體不多說(shuō)了,請(qǐng)看下面的代碼吧。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>測(cè)試</title> <script type="text/javascript" src="../resources/js/jquery-1.11.1.min.js"></script> <script type="text/javascript"> $(function(){ //動(dòng)態(tài)添加 $(".add").on("click",function(){ console.log("進(jìn)來(lái)了"); $(".info").append('<div class="delete"><h3>單擊我來(lái)刪除我</h3></div>'); }); //對(duì)動(dòng)態(tài)添加的元素添加事件-刪除 $(".info").on("click",".delete",function(){ console.log("進(jìn)來(lái)了Delete!"); $(this).remove(); }); }); </script> </head> <body> <h2 class='add'>單擊我添加動(dòng)態(tài)元素</h2> <div class="info"></div> </body> </html>
以上代碼就是本文對(duì)jquery append 動(dòng)態(tài)添加的元素事件on 不起作用的解決方案,希望對(duì)大家學(xué)習(xí)有所幫助。
- 解決jQuery使用append添加的元素事件無(wú)效的問(wèn)題
- jquery?追加元素append、prepend、before、after用法與區(qū)別分析
- jQuery 追加元素的方法如append、prepend、before
- jQuery中append、insertBefore、after與insertAfter的簡(jiǎn)單用法與注意事項(xiàng)
- jQuery使用before()和after()在元素前后添加內(nèi)容的方法
- jquery.ajax之beforeSend方法使用介紹
- jquery追加元素的所有方法全面深入實(shí)例講解(append、prepend、after、before、wrap等等)
相關(guān)文章
jQuery實(shí)現(xiàn)鼠標(biāo)跟隨提示層效果代碼(可顯示文本,Div,Table,Html等)
這篇文章主要介紹了jQuery實(shí)現(xiàn)鼠標(biāo)跟隨提示層效果代碼,具備顯示文本,Div,Table,Html等功能.涉及jQuery針對(duì)鼠標(biāo)事件及頁(yè)面元素的相關(guān)操作技巧,需要的朋友可以參考下2016-04-04jquery 動(dòng)態(tài)調(diào)整textarea高度
用jquery實(shí)現(xiàn)的調(diào)整textarea高度的實(shí)現(xiàn)代碼。這個(gè)動(dòng)畫(huà)效果比較流暢。適合新手學(xué)習(xí)。2009-11-11jQuery三組基本動(dòng)畫(huà)與自定義動(dòng)畫(huà)操作實(shí)例總結(jié)
這篇文章主要介紹了jQuery三組基本動(dòng)畫(huà)與自定義動(dòng)畫(huà)操作,結(jié)合實(shí)例形式總結(jié)了jQuery基本動(dòng)畫(huà)函數(shù)與自定義動(dòng)畫(huà)相關(guān)操作技巧及使用注意事項(xiàng),需要的朋友可以參考下2020-05-05jquery插件bootstrapValidator表單驗(yàn)證詳解
這篇文章主要為大家詳細(xì)介紹了jquery插件bootstrapValidator表單驗(yàn)證,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-12-12JQuery 使用attr方法實(shí)現(xiàn)下拉列表選中
實(shí)現(xiàn)下拉列表選中的方法有很多,這篇文章主要介紹了JQuery 使用attr方法的具體實(shí)現(xiàn),需要的朋友可以收藏下2014-10-10jQuery插件實(shí)現(xiàn)手風(fēng)琴二級(jí)菜單
這篇文章主要為大家詳細(xì)介紹了jQuery插件實(shí)現(xiàn)手風(fēng)琴二級(jí)菜單,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-10-10