獲取動態創建

Question

列

的ID在ID的productTable的表，我使用下面的jQuery代碼添加行：

$('#productTable').html(""); 
for (var i = 0; i < result.count; i++) 
{ 
     $('#productTable').append('<tr id=' + result.productArray[i].productID + 'class="product"><td><a> '+result.productArray[i].productName+'</a></td></tr>'); 
} 

和我使用的附加處理這些行：

$("#productTable").on("click","tr",function(event){ 
       alert(this.id); 
      }); 

但我得到的ID是表格，而我想要被點擊的行的ID。

幫助

Answer 1

試試這個：

$('#productTable').html(""); 
for (var i = 0; i < result.count; i++) 
{ 
    var obj = $('<tr id=' + result.productArray[i].productID + 'class="product"><td><a> '+result.productArray[i].productName+'</a></td></tr>'); 
    $(obj).click(function(event){ 
     alert($(this).attr("id")); 
    }); 
    $('#productTable').append(obj); 
} 

Answer 2

的問題是要追加什麼，這不是有效的HTML

$('#productTable').append(
    '<tr id=' + result.productArray[i].productID + 'class="product"> 
     <td> 
      <a> '+result.productArray[i].productName+'</a> 
     </td> 
    </tr>' 
); 

看得很仔細，還有周圍的ID暫無報價，並且沒有空格分隔ID和班級。
基本上你最終

<tr id=idclass="product"> 
    <td> 
     <a>text</a> 
    </td> 
</tr> 

正確的代碼將

$('#productTable').append('<tr id="' + result.productArray[i].productID + '" class="product"><td><a> '+result.productArray[i].productName+'</a></td></tr>'); 

Answer 3

Bind事件在動態創建的元素。這是另一種做你想做的事情的方法。

$('#productTable').html(""); 
for (var i = 0; i < result.count; i++) 
{ 
    $('#productTable').append('<tr id=" + result.productArray[i].productID + " class="product"><td><a> '+result.productArray[i].productName+'</a></td></tr>'); 
    $('#'+result.productArray[i].productID).bind('click',function(){ 
     //put your code here 
    }); 
} 

Demo