日历动态生成元素上的jQuery click事件？

Question

以下问题的答案，

var counter = 0;
$("button").click(function() {
 $("h2").append("<p class='test'>click me " + (++counter) + "</p>")
});

$("h2").on("click", "p.test", function(){
 alert($(this).text());
});

我有一个动态生成的日历，当您单击某天时，它会代替日历以替换当天的事件，而不是打开新的网页。 这些事件在表中列出，我希望能够单击一行并使其触发使用location.assign()的函数。 因此，每一行如下所示

<tr id="message-7">

日历中的新页面加载并创建，

<tr id="message-132">

单击不会触发该功能。 在另一个问题的示例中，它访问元素的文本以使元素唯一，而不是像我这种情况那样为元素赋予唯一的ID＃。

我是否以错误的方式解决问题？ 我可以添加诸如"title=132"标签之类的东西以供参考吗？

Answer 1

理想情况下，尽量不要使ID产生太多含义。 而是使用此处显示的数据。

所以代替

<tr id="message-7">

采用

<tr id="1234567" data-message="7">

然后在代码中，您可以将数据寻址为：

var messageVal = $("#1234567").data("message")

并且，如果您需要添加通用的click事件，则可能要对所有适当的TR使用虚拟的CSS类分配：

 <tr id="1234567" data-message="7" class="messageRow">

这样你就可以写

$(".messageRow").on("click", function(event){
    event.preventDefault()
    var messageVal = $(this).data("message")

这在仅某些TR包含可点击内容的情况下很有用-只是不要将类分配给其他TR。