click事件未檢測

Question

當我被先例問題的建議，下面就那並不是將不起作用代碼：

<div class="comments"></div> 

    <textarea cols="" rows="" name="proposition" id="propo-textarea-spec"></textarea> 

    <button id="my-btn">Make m'y request!</button> 

    <div class="my-btn-spec invisible"> 
     <div class="section"> 

     <div class="info tag-comment-spec"></div> 
         <p class="targetting"></p> 
        </div> 
    </div> 

    <script> 
     
     $('#my-btn').click(function() { 
      var comment = $('#propo-textarea-spec').val(); 
     
         $('.targetting:last').text(comment); 
         
         var content = $('div.my-btn-spec').html(); 
         $('div .comments').append(content); 

        }); 


     $('.comments .tag-comment-spec').click(function(){ 
      alert('hello'); 
       
     }); 

    </script> 

事實是，代碼工作細，附加股利，但它是單擊新的附加div時不可能觸發警報消息。奇怪的是，我的檢查員正確檢測到tag-comment-spec div，但點擊什麼都沒有觸發。

有沒有人有想法？

Answer 1

由於您將.tag-comment-spec動態追加到DOM，因此您需要使用.on()的委託事件處理程序。

$('.comments').on('click', '.tag-comment-spec', function() { 
    alert('hello'); 
}); 

的.on()爲代表事件與動態元素處理語法是：

$(StaticElement).on(eventName, target, handlderFunction); 

在哪裏，StaticElement指屬於DOM在頁面加載的元素，幷包含target元件和target是元件要在其上綁定事件。

相關裁判：

• jQuery的.on()

Answer 2

也許你想看看.live()。或者，因爲這已被棄用，.on()。
我認爲新內容沒有eventlistener，因爲添加事件監聽器是在頁面加載。用.on()或.live()你沒有這個問題。

$("#myEl").on("click", dosomething); // live and click are exchangeable here. (Only in syntax. Effectivity may be discussed.) 

Answer 3

對附加div使用jQuery .on函數，而不是.click事件。

http://api.jquery.com/on/

Answer 4

當你與警報附加上點擊功能裏面你只安裝該事件處理程序，以現有的通過選擇匹配的元素。

您需要使用事件委託才能將事件處理程序附加到可能存在的事件。嘗試：

$('.comments').on('click', '.tag-comment-spec', function() { 
    alert('hello'); 
    // Do more stuff 
});