页面上的识别动态生成的内容

Question

什么是页面上确定动态生成元件的最佳实践方法是什么？

让我解释一下。我有元素的列表，为用户定义，一个页面上可以有少或多种元素。这些对应的一个项目每一个每一个与它自己的ID。现在，用户可以编辑或删除网页上公布这些元素的能力和这些操作使用jQuery处理。各元件配备了每个操作他们可以操作的链接（即删除和编辑）。

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

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

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

这是从理想的明显远因为这将意味着许多DOM元素可以具有相同的ID。我也可以创造我自己等属性作为elementID但我相信这打破标准。

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

Answer 1

我已经这样做了相当多的为我的网站和我的解决办法是，你从开始的组合和一些评论的：

使用的命名约定，如 “ELEMENT_TYPE：ID：行动”。所以，你的榜样的产生是“元素：23：删除”。然后，你可以拆分（）的.attr（“ID”），你已经抓住了，并确定它是什么（“报告” VS“文件夹”），该ID和你想要做的（“删除”什么，“编辑”， “移动”）。

这已制定了对我非常好，而且是非常可扩展性。

我会保持类，虽然，这样就可以很容易地通过jQuery附加事件。

詹姆斯

Answer 2

为什么不只是添加一个类来代替。这也解决了有多个ID的正如你躲避到是不允许的，会导致随后的jQuery操作重大问题的问题。

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

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

   });

Answer 3

您可以做的另一件事是这样的：

<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：一切都没有一个最好的做法。有些事情就需要一个新的appoach。

干杯，JRH