多個鏈接< a >訪問相同的JQuery方法

我在從數據庫呈現的頁面中有多個鏈接。他們所有我給了相同的ID，並創建了一個JQuery的點擊功能，從該ID。我試圖運行一個簡單的測試調用警報，但它不起作用。它不是假設工作？有更好的方法嗎？多個鏈接< a >訪問相同的JQuery方法

$("#lkResumeIt").click(function() { 
    alert("resume it"); 
}); 

<a id='lkResumeIt' href='#' contentID='1'>Item 1</a> 
<a id='lkResumeIt' href='#' contentID='18'>Item 2</a> 
<a id='lkResumeIt' href='#' contentID='22'>Item 3</a> 
...

以下，使用類選擇的代碼細workd當元件是靜態的，但是當它們是動態他們不。請參閱下面的實際代碼：

<script language="javascript"> 

$("#divContent").on('click', 'a.linky', function (event) { 
    alert("resume it"); 
}); 




      function RunIt() { 
       $("#divContent").html(""); 
       var jsongo = ''; 
       $.ajax({ 
        type: 'POST', 
        url: '/Controller/FollowingPaused/', 
        data: jsongo, 
        success: function (msg) { 
         for (i = 0; i < msg.length; i++) { 
          var htmlCode = "<a href='/Controller/Details/" + msg[i].ID + "' style = 'float: left;'><img class='packageImage' border='0' src='" + msg[i].Size0Path + "' /></a>"; 
          htmlCode += "<span style='float: left;margin: 5px 0px 0px 10px;'>" + "<b>" + msg[i].TheName + "</b><br>"; 


          if (msg[i].IsPaused == true) { 
           //htmlCode += "<a href='/Controller/Resume/" + msg[i].ID + "'>Resume</a>"; 
           htmlCode += "<a href='#bar' class=linky contentID='" + msg[i].ID + "'>Resume</a>"; 
          } else { 
           //htmlCode += "<a href='/Controller/Pause/" + msg[i].ID + "'>Pause</a>"; 
           htmlCode += "<a href='#bar' class=linky contentID='" + msg[i].ID + "'>Pause</a>"; 
          } 
          htmlCode += "</span>"; 
          htmlCode += "<div class='clear'></div>"; 
          $("#divContent").append(htmlCode); 
         } 
        } 
       }); 
      } 


RunIt() 

</script> 



     <div style="display: table-row;"> 
      <div id="divContent" style="display: table-cell; line-height: 1.5;"> 
      </div> 
     </div>

來源

2012-09-29 RollRoll

ID不能重複。如果你想要一個jQuery鉤子，使用class，它可以被複制。

實施例：

HTML：

<a href="#bar" class="linky">Foo</a>

的JavaScript：

$("a.linky").on('click', function (event) { 
    alert("resume it"); 
});

對於動態創建的元素：

$("#your-static-wrapper-element").on('click', 'a.linky', function (event) { 
    alert("resume it"); 
});

來源

2012-09-29 17:03:39

使用'$（「a.linky」）。on' ... – StaticVariable

@jhonraymos良好的漁獲物。現在更正。 –

謝謝，但代碼無法正常工作時生成html，例如：$（「＃divContent」）。append（「

」） – RollRoll

你不能用同一個ID兩次，因爲：

您的代碼不會被W3C被valited，什麼意思，你可以有你的網站保持兼容翻過瀏覽器頭疼的問題。它可以在一個瀏覽器中正常工作，而在其他瀏覽器中則不會。

您可以使用

<div class="main"></div> 
    <div class="main"></div> 
$(".main").click(function(){ 
$(this).something.. 
})

來源

2012-09-29 17:29:32 StaticVariable

多個鏈接< a >訪問相同的JQuery方法

回答

相關問題