jquery
2014-02-19 68 views 2 likes 
2

在我預先設置一個div後,我想提醒點擊它,但我似乎無法應付它。我在這裏有錯字還是有另一個原因,爲什麼這不起作用?而登記爲同一事件預先設置一個div,然後點擊它將其刪除

http://jsfiddle.net/K6EbM/1/

與類 .ansicht_gross
$(".newsbilder").click(function() { 
    var lbox = '<div class="ansicht_gross" style="height:100%; width:100%; background-color: green;">remove</div>'; 
    $("body").prepend(lbox); 
}); 

$(".ansicht_gross").click(function() { 
    alert(1); 
}); 

回答

2

你需要event delegation動態添加DOM elements.use:

$("body").on('click','.ansicht_gross',function() { 
    alert(1); 
}); 

Working Demo

2

元素將不可用。所以在這種情況下,您必須將事件委派給其最近的靜態父代以使您的代碼正常工作。這種過程被稱爲Event delegation

嘗試,

$("body").on('click',".ansicht_gross",function() { 
    alert(1); 
}); 
2

您需要使用event delegation在這裏,因爲你的div已被動態補充說:

$('body').on('click', '.ansicht_gross', function() { 
    alert(1); 
}); 

這將有助於你綁定click事件到新增加的.ansicht_gross div。

Fiddle Demo

1

使用上。

$(".newsbilder").click(function() { 
    var lbox = '<div class="ansicht_gross" style="height:100%; width:100%; background-color: green;">alert on click</div>'; 
    $("body").prepend(lbox); 
}); 

$('body').on('click',".ansicht_gross", function() { 
    alert("1"); 
}); 

DEMO

2

你也可以這樣做:

$('.newsbilder').click(function() { 
    var lbox = $('<div /* attributes */>alert on click</div>'); 
    $("body").prepend(lbox); 
    lbox.click(function() { 
     alert(1); 
    }); 
}); 

值得一提的是,事件代表團導致它們不一定需要額外的操作,也就是說,只要你單擊BODY元素,jQuery瀏覽被點擊的孩子的祖先,以便檢查它們中的任何一個是否匹配傳遞的選擇器,正如它發生的那樣,'.ansicht_gross'。想象一下,一個脾氣暴躁的用戶在應用程序中的任何地方開始點擊的速度都很快...... = D好吧,這有點扭曲,但請記住,有更多的選擇器需要檢查,越多的比較去表演。所以,需要謹慎使用。

延伸閱讀:Are there any drawbacks to listen events on document level in jQuery?

相關問題