jquery append 動態(tài)添加的元素事件on 不起作用的解決方案
用jquery添加新元素很容易,面對jquery append 動態(tài)添加的元素事件on 不起作用我們該如何解決呢?on方法中要先找到原選擇器(如例.info),再找到動態(tài)添加的選擇器(如列.delete)。
具體不多說了,請看下面的代碼吧。
<!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>測試</title> <script type="text/javascript" src="../resources/js/jquery-1.11.1.min.js"></script> <script type="text/javascript"> $(function(){ //動態(tài)添加 $(".add").on("click",function(){ console.log("進(jìn)來了"); $(".info").append('<div class="delete"><h3>單擊我來刪除我</h3></div>'); }); //對動態(tài)添加的元素添加事件-刪除 $(".info").on("click",".delete",function(){ console.log("進(jìn)來了Delete!"); $(this).remove(); }); }); </script> </head> <body> <h2 class='add'>單擊我添加動態(tài)元素</h2> <div class="info"></div> </body> </html>
以上代碼就是本文對jquery append 動態(tài)添加的元素事件on 不起作用的解決方案,希望對大家學(xué)習(xí)有所幫助。
- 解決jQuery使用append添加的元素事件無效的問題
- jquery?追加元素append、prepend、before、after用法與區(qū)別分析
- jQuery 追加元素的方法如append、prepend、before
- jQuery中append、insertBefore、after與insertAfter的簡單用法與注意事項(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針對鼠標(biāo)事件及頁面元素的相關(guān)操作技巧,需要的朋友可以參考下2016-04-04jquery 動態(tài)調(diào)整textarea高度
用jquery實(shí)現(xiàn)的調(diào)整textarea高度的實(shí)現(xiàn)代碼。這個(gè)動畫效果比較流暢。適合新手學(xué)習(xí)。2009-11-11jQuery三組基本動畫與自定義動畫操作實(shí)例總結(jié)
這篇文章主要介紹了jQuery三組基本動畫與自定義動畫操作,結(jié)合實(shí)例形式總結(jié)了jQuery基本動畫函數(shù)與自定義動畫相關(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)琴二級菜單
這篇文章主要為大家詳細(xì)介紹了jQuery插件實(shí)現(xiàn)手風(fēng)琴二級菜單,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-10-10