jquery append 動態(tài)添加的元素事件on 不起作用的解決方案
更新時間：2015年07月30日 15:48:25 作者：機器有毒
這篇文章主要介紹了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("進來了");
$(".info").append('<div class="delete"><h3>單擊我來刪除我</h3></div>');
});
//對動態(tài)添加的元素添加事件-刪除
$(".info").on("click",".delete",function(){
console.log("進來了Delete！");
$(this).remove();
});
});
</script>
</head>
<body>
<h2 class='add'>單擊我添加動態(tài)元素</h2>
<div class="info"></div>
</body>
</html>
以上代碼就是本文對jquery append 動態(tài)添加的元素事件on 不起作用的解決方案，希望對大家學習有所幫助。
您可能感興趣的文章:
相關(guān)文章
在jQuery中,常常需要對元素的某個屬性或數(shù)值進行比較,判斷是否大于等于某個特定的值,在這種情況下,使用大于等于（>=）操作符是非常常見的,本文將介紹如何在jQuery中使用大于等于操作符的技巧,需要的朋友可以參考下2024-09-09
這篇文章主要介紹了jQuery綁定自定義事件使用技巧,通過循環(huán)綁定所有的自定義事件,在恰當?shù)臅r機調(diào)用,需要的朋友可以參考下。2016-06-06
這篇文章主要介紹了jQuery中slideUp()方法用法,以實例形式分析了slideUp()方法的功能、定義及具體使用技巧,具有一定的參考借鑒價值,需要的朋友可以參考下2014-12-12
使用jquery.form.js實現(xiàn)圖片上傳的方法
這篇文章主要介紹了使用jquery.form.js實現(xiàn)圖片上傳的方法,涉及jquery使用表單插件jquery.form.js進行圖片上傳的提交、類型驗證、執(zhí)行結(jié)果回調(diào)顯示等技巧,非常簡單實用,需要的朋友可以參考下2016-05-05
簡短幾句jquery代碼的實現(xiàn)一個圖片向上滾動切換
短幾句jquery代碼實現(xiàn)一個圖片向上滾動切換，需要的朋友可以參考下。2011-09-09
淺談EasyUi ComBotree樹修改 父節(jié)點選擇的問題
下面小編就為大家?guī)硪黄獪\談EasyUi ComBotree樹修改 父節(jié)點選擇的問題。2016-11-11
jQuery獲取文本節(jié)點之 text()/val()/html() 方法區(qū)別
在jquery中val,text,html都能取到值,或加一個參數(shù)來賦值,那么它們有些什么區(qū)別?2011-03-03
之前有碰到過jQuery實現(xiàn)列表自動滾動，這次的圖片輪播在原理上與之相同，只有一些細微的差別，就是需要在圖片的右下角顯示當前圖片的序號2013-09-09
Jquery中的$.each獲取各種返回類型數(shù)據(jù)的使用方法
each()方法能使DOM循環(huán)結(jié)構(gòu)簡潔，不容易出錯。each()函數(shù)封裝了十分強大的遍歷功能，使用也很方便，它可以遍歷一維數(shù)組、多維數(shù)組、DOM, JSON 等等，在javaScript開發(fā)過程中使用$each可以大大的減輕我們的工作量。2015-05-05
JQuery動態(tài)生成的按鈕無法觸發(fā)問題及完美解決方法
利用JQuery動態(tài)添加的按鈕無法通過$(selector).click方法觸發(fā)點擊事件,下面小編給大家?guī)砹薐Query動態(tài)生成的按鈕無法觸發(fā)問題與解決方法,需要的朋友可以參考下2023-02-02