活動代表團與文檔一起工作，但不與父母一起工作

我有以下HTML代碼，並且我正在嘗試添加單擊照片時的「選定」類，並在再次單擊時刪除該類。活動代表團與文檔一起工作，但不與父母一起工作

<div id="container"> 
     <h1>Photo Gallery</h1> 

     <div id="gallery"> 
     <div class="photo"> 
      <img src="photos/skyemonroe.jpg"> 
      <div class="details"> 
      <div class="description">The Cuillin Mountains, Isle of Skye, Scotland.</div> 
      <div class="date">12/24/2000</div> 
      <div class="photographer">Alasdair Dougall</div> 
      </div> 
     </div> 

     //Repetitions of the photo class..... 

     </div> 
     <a id="more-photos" href="pages/1.html">More Photos</a> 
</div>

我目前使用下面的jQuery代碼，這樣，當點擊更多圖片按鈕時，更多的圖片被添加到頁面綁定一個事件處理照片的祖先

，jQuery代碼仍然可以與這些新工作添加圖片。

jQuery的

$('#gallery').on('click','.photo',function(){ 
    $(this).toggleClass('selected'); 
    });

jQuery代碼上面不工作時，我嘗試使用#gallery，NOR沒有當我嘗試使用＃container.However它的工作，代碼工作當我使用$（文件）爲事件代表團。

我似乎無法弄清楚爲什麼綁定事件處理程序到父元素不起作用，但綁定到文檔本身使其工作。

希望得到任何見解此事

編輯：添加這裏的jsfiddle http://jsfiddle.net/744cX/（代碼工作中的小提琴，但不會在我的筆記本什麼，我似乎無法找出原因）

來源

2014-04-20 Kenneth .J

添加更多相關的代碼添加的jsfiddle – Dave

@kenneth聽事件：您可以共享更改代碼內容。 –

@Dave和@ Milind Anantwar我已經添加了小提琴，代碼在小提琴中工作，但不在我的電腦上工作... –

我分叉的小提琴和可以在這裏看到：

http://jsfiddle.net/6Qz8C/1/

$('#gallery').on('click','.photo',function(){ 
    $(this).toggleClass('selected'); 
});

我所做的：

當nextpage事件被觸發時，附加一張新照片。
當文檔準備就緒時添加事件委託。
設置委託方的#gallery

來源

2014-04-20 08:50:41 Andrei

您可以在「.photo」類

<div class="photo" onclick="$(this).toggleClass('selected');">

來源

2014-04-20 08:52:06 dbucki

不，因爲OP正在動態添加照片。所以.on比.lcik好，因爲.click只能找到那些出現在你綁定事件 – Adam

好的地方。所以你可以添加屬性onclick =「$（this）.toggleClass（'selected'）;」在html中 – dbucki

你*可以*。但爲什麼？你可以在添加新元素時運行新的'$（）。click（function（）{}）'（比iinline onclick imo更好）。但通常使用事件委派並僅在一個地方使用事件代碼會更好。 – Adam

活動代表團與文檔一起工作，但不與父母一起工作

回答

相關問題