Question

假设我通过PHP在我的网页上生成一个记录列表，并假设每个记录旁边都有一个链接。让我们说当我点击链接时会弹出一个模态窗口，然后在模态中显示一个编辑表单。

我可以很容易地发生这样的事情：

<a href="javascript:showEditModal(12345)">Edit</a>

但我更喜欢使用jQuery事件监听器：

<a class="edit" href="#">edit</a>

$('.edit').click(function(event) {
  showEditModal(recordId);
});

正如您所看到的，使用事件监听器，我无法通过模态知道用户想要编辑哪条记录。

如何在仍然使用编辑链接的事件侦听器时允许用户指定要编辑的记录？

Answer 1

如果使用jQuery＆gt; = 1.4.3，您可以在链接上指定“data-id”属性（HTML5！woohoo）并使用jQuery的data（）方法获取它：

<script>
$(function() {
  $('a.edit').click(function() {
    alert( $(this).data('id') );
  });
});
</script>
<a href="#" class="edit" data-id="12345">edit</a>

here's a demo on jsFiddle。

Answer 2

将ID放在元素的属性中。

Answer 3

<a class="edit" href="#12345">edit</a>

$('.edit').click(function(e) {
  e.preventDefault();
  recordId = $(this).attr("href").substr(1);
  showEditModal(recordId);
  return false;
});

将变量（记录ID）传递给jQuery事件侦听器的方法？

3 个答案: