0

识别页面上动态生成的元素的最佳实践方法是什么？

让我解释。我有一个元素列表，页面上的元素可以与用户定义的一样少或多。每一个都对应一个项目，每个项目都有自己的 id。现在，用户可以在页面上编辑或删除这些元素，这些操作由 jQuery 处理。每个元素都有一个链接，它们可以执行的每个操作（即删除和编辑）。

现在的问题是知道用户选择了哪个元素。为了解决这个问题，我给每个链接元素的 ID 作为 ID 属性，然后我使用 jQuery 获取它：

<a href="#" class="delete" id="<%= Model.elementID%>">Delete</a>

<script type="text/javascript">
    $(".delete").live("click", function (event) {
        event.preventDefault();
        var elementID = $(this).attr("id");
        //other code
    });
</script>

这显然远非理想，因为这意味着许多 DOM 元素可能具有相同的 ID。或者，我可以创建自己的属性，例如 elementID，但我相信这违反了标准。

那你有什么推荐的。如何识别页面上动态生成的元素？

4

3 回答 3

2

我已经为我的网站做了很多这样的事情，我的解决方案是结合了您的起点和一些评论：

使用命名约定，例如“element_type:id:action”。因此，您的示例生成为“element:23:delete”。然后你可以拆分（）你抓取的.attr（“id”）并确定它是什么（“report”与“folder”），id，以及你想要做什么（“delete”，“edit “， “移动”）。

这对我来说效果很好，并且非常可扩展。

不过，我会保留课程，以便您可以通过 jquery 轻松附加事件。

詹姆士

于 2009-07-02T11:12:23.740 回答
0

为什么不直接添加一个类。这也解决了不允许使用多个 id 的问题，这将导致后续 jquery 操作出现重大问题。

<a href="#" class="delete" id="<%= Model.elementID%>">Delete</a>

  $(".delete").live("click", function(event) {
      event.preventDefault();
      //other code
      $(yourNewElement).addClass('noob');

   });
于 2009-07-02T09:52:33.073 回答
0

您可以做的另一件事是：

<a href="#<%= Model.elementID%>" class="delete"> Delete </a>
$(".delete").live("click", function(event) {
    event.preventDefault();
    var elementID =  $(this).attr("href");
    // strip the preceding '#'

    // rest of your code
});

PS：一切都没有最佳实践。有些事情只是需要一个新的方法。

干杯，jrh

于 2009-07-02T10:15:04.153 回答