Question

我试图获取动态生成表的id属性。所以，如果我点击我想要的第一个链接＆＃34; editEmploee-4＆＃34;。

<table id="example" class="table span12 table-bordered table-hover">
   <thead>
      <tr>
         <th>Firstname</th>
         <th>Lastname</th>
         <th>Edit</th>
      </tr>
   </thead>
   <tbody>
      <tr>
         <td>Person 1</td>
         <td>Name Person 1</td>
         <td><a href="#" class = "editDialog" id="editEmployee-4"><img src="img/edit.png" height="20" /></a></td>
      </tr>
      <tr>
         <td>Person 2</td>
         <td>Name Person 2</td>
         <td><a href="#" class = "editDialog" id="editEmployee-5"><img src="img/edit.png" height="20" /></a></td>
      </tr>
      <tr>
         <td>Person 3</td>
         <td>Name Person 3</td>
         <td><a href="#" class = "editDialog" id="editEmployee-47"><img src="img/edit.png" height="20" /></a></td>
      </tr>
   </tbody>
</table>

我已经尝试过这段代码，但我总是得到相同的ID。

var data = $( "a[id][class=editDialog]" ).attr('id');

您是否知道如何获取动态生成的链接ID？

Answer 1

活动授权：

$(document).on("click", "#example a", function() {
    console.log(this.id); //id of clicked link
});

不确定动态生成多少表，但您通常希望使用容器元素而不是document

Answer 2

$(".editDialog").click(function(e)
{
  e.preventDefault();
  var myID = $(this).attr("id");
 // do something with myID
})

Answer 3

您可以在锚点的内部点击处理程序中使用this.id：

$('.editDialog').click(function() {
    var data = this.id;
});

但由于您的表是动态生成的，因此该表及其中的元素将无法使用所有事件，在这种情况下，您需要应用事件委派技术以附加这些事件，例如在您的案例中单击这些新添加的元素：

$(document.body).on("click", "#example a", function() {
    var data = this.id;
});

实际上，当您将委托事件绑定到最近的静态父级而不是$(document)时，它会更有效。

Answer 4

因为我们有一个班级＆＃34; editDialog＆＃34;在所有标签中。我们可以在JQuery或Java Script代码中使用它：

JQuery的::

$('.editDialog').bind('click', function(){
alert($(this).attr('id'));
});

Java Script ::

$('.editDialog').bind('click',function(){
var clickedID = this.id;
alert(clickedID);
});

jQuery获取链接ID

4 个答案: