通過Id選擇動態控制

我嘗試通過Jquery在表中動態創建兩個相同的元素，但Id是問題。我嘗試根據元素編號創建一個Id，var id =「links」+ i;但是，我不能通過$（「＃」）選擇這個元素，即使我使用「Links1」作爲id選擇器。我不知道有什麼問題。通過Id選擇動態控制

<script type="text/javascript"> 
    $(function() { 
     var number = 2; 
     for (var i = 0; i < number; i++) { 
      var id = "links" + i; 
      var item = $("<td><a id ='" + id + "'>" + i + "</td>"); 
      $("#" + id).click(function() { 
       alert("Great"); 
      }); 
      $("#TrInput").append(item); 
     } 
    }); 
</script> 

<body> 
<form id="form1" runat="server"> 
<div> 
<table><tr id="TrInput"></tr></table> 
</div> 
</form>

來源

2013-07-16 YI Zhang

使用'on'代替 –

'click'是'on'的快捷方式，也不會有所作爲，除非你使用代表團......在這種情況下，，從'＃form1' – smerny

在你結合$('#' + id)時，該元素不會在DOM存在。所以它不綁定點擊處理程序。

取而代之的是，綁定到item.click或僅在調用append後綁定。或者，您可以使用事件委託並綁定到document，但對於該解決方案，最好查看jQuery事件委派並查看它是如何工作的。

來源

2013-07-16 17:28:53

您可以在您剛剛創建的項目直接添加監聽...

var item = $("<td><a id ='" + id + "'>" + i + "</td>"); 
item.click(function() { 
     alert("Great"); 
}); 
$("#TrInput").append(item);

使用一些代表團，這不會是非常實用與正在創建的電流的方式來做到提到ID和ID訪問。我會用一個類來選擇的，就像這樣：

var item = $("<td><a id ='" + id + "' class='itemClass'>" + i + "</td>");

，然後你可以改變你的爲您的活動選擇這樣：

$("#form1").on("click", ".itemClass", function() { ...

來源

2013-07-16 17:29:02 smerny

使用事件代表團。而不是在你的td結合click事件的每一個a：

$("#TrInput").on("click", "a", function(e) { 
    e.preventDefault(); //just in case 
    alert("hi!"); 
});

所以，既然你tr已經存在它會很樂意委派事件被點擊a時處理。而且，如果你tr也是動態的，你會做這樣的事情：

$("table").on("click", "tr a", function(e) { 
    e.preventDefault(); //just in case 
    alert("hi!"); 
});

來源

2013-07-16 17:30:00 krishgopinath

-1

在你結合的時候，該元素不會在DOM存在。所以它沒有綁定點擊處理程序，因爲沒有要綁定的元素。因此，一個簡單的解決方案就是使用授權。現在，使用委託的美妙之處在於，不管元素何時創建，處理程序都被分配給元素。這應該對你有用。 PS：當你必須在旅途中（動態地）創建元素時，你應該嘗試使用委託。

來源

2013-07-16 17:30:26 user1

'＃Links1'你錯過了英鎊符號。這是事件代表團。這是一個很好的解決方案，但我會建議你解釋他做錯了什麼，以及爲什麼這個工作:) –

更改你的腳本如下：

 $(function() { 
      var number = 2; 
      for (var i = 0; i < number; i++) { 
       var item = $("<td><a id ='links'>" + i + "</td>"); 
       $("#TrInput").append(item); 
      } 
     });

一旦創建項目後，使用上/委託方法，因爲點擊亙古不變的動態創建的元素工作;所以，下一行代碼是：

$("#links").on("click",function(){ 
// As now you have two elements with the same ID, make use of: this property; 
    Suppose you want to change the color of that clicked element, that would be: 
$(this).css("color","#0777da"); 
//This effects only the currently selected/clicked element and 
    not every other element with the same Id.. 
});

來源

2013-07-16 18:01:44

通過Id選擇動態控制

回答

相關問題