更新 ID 和 jQuery 事件处理程序的问题[关闭]

【问题标题】：Trouble with updating IDs and jQuery event handlers [closed]更新 ID 和 jQuery 事件处理程序的问题[关闭]
【发布时间】：2019-01-28 11:01:15
【问题描述】：

我正在尝试制作某种形式，但我被困在第三步。

我的下一个按钮确实有一个像这样递增的 ID：

$('#to-q-2').click(function (e) {
    e.preventDefault();
    $(this).attr("id", "to-q-3");
})

所以 id 被更新了。但是当我再次点击时：

$('#to-q-3').click(function(e) {
        e.preventDefault();
        alert('stop');
});

什么都没有发生。我猜 jQuery 没有更新 DOM，但我不知道该怎么做。有什么线索吗？

【问题讨论】：

标签： javascript jquery forms next

【解决方案1】：

您需要将点击事件添加到document，以便它可以查找在click 事件的初始绑定时不存在的新元素，这样您就可以将点击事件添加到动态添加的元素中。你可以这样做：

$(document).on('click', '#to-q-3', function() {...})

请参阅下面的工作示例：

$(document).on('click', '#to-q-2', function (e) {
    e.preventDefault();
    $(this).attr("id", "to-q-3");
});

$(document).on('click', '#to-q-3', function(e) {
  e.preventDefault();
  alert("stop");
});

#to-q-2 {
  color: red;
}

#to-q-3 {
  color: lime;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="to-q-2">Click this div</div>

【讨论】：