jquery1.7.2單擊事件不發射

我試圖綁定一個點擊事件div有一個id="unit"。論文div是在運行時生成的，而我的JavaScript似乎不起作用。jquery1.7.2單擊事件不發射

我的javascript點擊事件。

$("#unit").click(function(){ 
    alert('1'); 
});

ajax調用之前。

<div id="content"> 
    <div id="building"> 

    </div> 

    <div id="units"> 

    </div> 
</div>

ajax調用後。

<div id="content"> 
     <div id="building"> 
      <div value="1" class="buildingBlock"><h3 style="text-align: center;">Level - 1</h3></div> 
      <div value="2" class="buildingBlock"><h3 style="text-align: center;">Level - 2</h3></div> 
      <div value="3" class="buildingBlock"><h3 style="text-align: center;">Level - 3</h3></div> 
      <div value="4" class="buildingBlock"><h3 style="text-align: center;">Level - 4</h3></div> 
     </div> 


     <div id="units"> 
      <div value="1" id="unit">#02-01<br>3 room(s)</div> 
      <div value="2" id="unit">#02-02<br>2 room(s)</div> 
      <div value="3" id="unit">#02-03<br>5 room(s)</div> 
     </div> 
    </div>

來源

2012-05-30 root

您的HTML無效。 ID應該是唯一的，而'div'元素不具有'value'屬性。 – VisioN

這個問題每天都會出現。請正確閱讀[jQuery入門]（http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery），並通過[API]（http://api.jquery.com/）閱讀。 –

@VisioN感謝您指出。我很清楚這一點。但具有價值標籤似乎不影響任何東西。 – root

因爲您正在動態附加#unit元素，所以您需要將事件委託給最近的父元素。試試這個：

$("#units").on('click', '.unit', function(){ 
    alert('1'); 
});

此外，多個id attrbutes無效。您應更改代碼以使用類，如下所示：

<div id="units"> 
    <div value="1" class="unit">#02-01<br>3 room(s)</div> 
    <div value="2" class="unit">#02-02<br>2 room(s)</div> 
    <div value="3" class="unit">#02-03<br>5 room(s)</div> 
</div>

來源

2012-05-30 08:54:17

變化id到class的unit

<div id="units"> 
    <div value="1" class="unit">#02-01<br>3 room(s)</div> 
    <div value="2" class="unit">#02-02<br>2 room(s)</div> 
    <div value="3" class="unit">#02-03<br>5 room(s)</div> 
</div>

嘗試用委託的事件處理程序。

$("#units").on('click', '.unit', function(){ 
    alert('1'); 
});

來源

2012-05-30 08:53:51 thecodeparadox

令人困惑的是，jquery文檔中提到：「事件處理程序僅與當前選定的元素綁定;它們在代碼調用.on（）時必須存在於頁面上。」但後來擴展說明它仍然會涵蓋新元素 – jancha

您不能有多個具有相同ID的元素。

改爲使用class。例如class="unit"

，當你綁定在事件中使用$(".unit")..

此外，如果我們考慮Ajax請求，無論是成功的方法，或在後端，你應該好好準備額外的js代碼初始化新元素。事實上聽父母事實上是一種黑客。

所以，如果您有：

$.get("someurl", {}, function(data){ 
    $("#units").append(data); 
    $("#units .unit").unbind("click").bind("click", function(){ 
// your click handler here 
    }); 
});

至少我想，除非你有特殊需要從父控件的事件走那條路。

來源

2012-05-30 08:54:11 jancha

jquery1.7.2單擊事件不發射

回答

相關問題