我在文件assets/URL.js中有这段代码:
$(function(){
$("a").on("click", function () {
event.preventDefault();
var TheURL = $(this).attr('href');
if(TheURL){
$("#MyDiv").load(TheURL , { name: '' },
function() {
alert("done");
});
}
});
});
它的作用是，如果 <a>单击元素后，上面的函数会阻止页面转到该页面，然后获取 url 并将其加载到 div 中ID 为 MyDiv .
现在这是index.html的代码:
<html>
<head>
<script type="text/javascript" src="assets/URL.js?v=1"></script>
</head>
<body>
<div id="MyDiv">
<a href="files/1.html"></a>
</div>
</body>
</html>
以及代码files/1.html是:
<a href="2.html">2</a>
现在，当我点击<a>时在文件index.html中<div>的内容ID 为 MyDiv更改 file/1.html 的内容无需重新加载页面。
但是当我点击<a>时在文件file/1.html中页面重新加载并转到 file/2.html并且不遵循 assets/URL.js 中的代码，我怎样才能强制它跟随它并只替换 <div> 的内容ID 为 MyDiv ？
最佳答案
当动态html加载时，您需要再次设置事件处理程序，现在您只将点击事件绑定(bind)到index.html中现有的A标签，而不是像1.html这样的动态加载内容中 future 的A标签
你可以尝试这样的事情:
$(function(){
RefreshEventHandlers();
});
function RefreshEventHandlers() {
$("a").on("click", function () {
event.preventDefault();
var TheURL = $(this).attr('href');
if(TheURL){
$("#MyDiv").load(TheURL , { name: '' },
function() {
alert("done");
RefreshEventHandlers(); // bind click to newly added A tags.
});
}
});
}
确保在所有新 A 标记上设置点击事件处理程序
关于javascript - 如何确保加载的文件可以被js代码检测到，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58780987/