我真的不知道如何正确解释这一点,但我正在学习如何使用 AJAX,虽然我已经很清楚了,但我遇到了 JQuery 未引用调用的问题在 DIV 末尾重新生成的按钮。重新生成此按钮的原因是因为它位于内容被替换的 div 内部。 (在这种情况下,它是视频循环)。
我附上了一个显示我的问题的 JSFiddle。
我的 javascript 文件加载在我 body 的底部,如下所示:
<html>
<head>
...
</head>
<body>
...
<script src="..."></script>
</body>
</html>
var i = 0;
$('#bar').on('click', function() {
i++;
$('#foo').html('<button id="bar">Test button: ' + i + '</button>');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="foo">
<button id="bar">Test button: 0</button>
</div>
最佳答案
因为您正在使用 jQuery 动态生成 HTML,请尝试使用事件委托(delegate):-
var i = 0;
$('#foo').on('click', '#bar' ,function() {
i++;
$('#foo').html('<button id="bar">Test button: ' + i + '</button>');
});
或者
var i = 0;
$(document.body).on('click', '#bar' ,function() {
i++;
$('#foo').html('<button id="bar">Test button: ' + i + '</button>');
});
关于javascript - JQuery 不在 "refreshed"元素上注册事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28716940/