Javascript 更改element.innerHTML后，MooTools事件侦听器将消失
我正在尝试使用MooTools来完成这项任务 说明： 我在Javascript 更改element.innerHTML后，MooTools事件侦听器将消失,javascript,ajax,events,mootools,Javascript,Ajax,Events,Mootools,我正在尝试使用MooTools来完成这项任务 说明： 我在myButton链接上附加了一个事件侦听器。单击此链接将启动AJAX请求，并根据响应文本更新内容。 在这个请求过程中，一个POST变量被发送到“button.php”，但它目前没有被使用。（我希望稍后使用它） 好的，因此，myDiv获得了完全相同的链接，具有相同的ID（myButton）+一个随机数，这样我们就可以看到每次单击都会生成一个新的数字 问题： 第一次单击myButton后，myDiv会正确更新，显示一个随机数。当我第二次单击m
myButton在这个请求过程中，一个POST变量被发送到“button.php”，但它目前没有被使用。
（我希望稍后使用它）
好的，因此，
myDivmyButtonmyButtonmyDivmyButton请注意，我需要
myButtonmyDivmyDivindex.html
<html>
<head>
<script type="text/javascript" src="mootools-1.2.4-core-nc.js"></script>
<script>
window.addEvent('domready', function() {
$('myButton').addEvent('click', function(e) {
e.stop();
var myRequest = new Request({
method: 'post',
url: 'button.php',
data: {
action : 'test'
},
onRequest: function() {
$('myDiv').innerHTML = '<img src="images/loading.gif" />';
},
onComplete: function(response) {
$('myDiv').innerHTML = response;
}
});
myRequest.send();
$('myButton').removeEvent('click');
});
});
</script>
</head>
<body>
<div id="myDiv">
<a id="myButton" href="#">Button</a>
</div>
</body>
</html>
addEvent（'domready'，function（）{
$（'myButton'）.addEvent（'click'，函数（e）{
e、 停止（）；
var myRequest=新请求({
方法：“post”，
url:'button.php'，
数据：{
行动：“测试”
},
onRequest:function（）{
$（'myDiv'）。innerHTML=''；
},
未完成：功能（响应）{
$（'myDiv'）。innerHTML=响应；
}
});
myRequest.send（）；
$（'myButton'）。removeEvent（'click'）；
});
});
<a id="myButton" href="#">Button</a> clicked <?php echo rand(1,100); ?>单击您正在将事件附加到要替换的元素。dom无法知道对您来说，旧按钮和新按钮是相同的。将删除旧按钮（及其事件侦听器），并创建新按钮。因此，您需要将事件重新附加到新按钮 也就是说：为什么按钮必须在div中？令人难以置信。您可以随时从javascript更新按钮文本，无需替换它并继续创建新的侦听器对象。查看一次，在
myDiv$("myDiv").addEvent("click:relay(a)", function() {
...
);
如果您有多个
，每5秒更换一次链接。在myDiv
容器上只有一个事件设置，它处理所有
的所有点击，甚至是动态点击。如果您只想显示加载内容，请添加一个包含加载图像的div并切换其可见性。ootools似乎有点像jQuery“delegate”。我希望按钮位于div中，因为我需要为特定目标在该div中放置更多按钮。按钮将被调用，例如“添加”、“编辑”、“删除”。它们中的每一个都会将特定的功能加载到这个div中。我仍然会通过javascript以编程的方式来实现这一点。保留按钮的哈希表。动态隐藏、创建和显示它们。这样，事件侦听器就可以重复使用。+1用于显示代码、描述预期行为和描述错误行为（而不是“不起作用”）。
<a class="updateTrigger" id="myButton" href="#">Button</a>
$("myDiv").addEvent("click:relay(a.updateTrigger)", function() {
...
});