为什么从页面 2 加载到 page1 中的 HTML 的 JavaScript 不起作用

Why is JavaScript of the HTML from page2 loaded into page1 not working?

本文关键字：HTML 中的 JavaScript 不起作用 page1 加载 为什么      更新时间：2023-09-26

>im 尝试将 html 从第 2 页加载到第一页，但其 JavaScript 不起作用，这是同源策略吗？ 如果是，我如何绕过它？

页1：

    <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>page 1 test</title>
<script src="js/jquery-1.9.1.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#thisandthat').click(function() {
    $("#hide").toggle('fast');
    $("#cont").load('testpage2.html #res')
     $("#unhide").toggle('fast');
     console.log ()
});
});
</script>
</head>
<body>
<div id="">
<input id="thisandthat" name="test but" type="button" value="Button" />
<div id="hide" style="background-color:#050; width:100; height:100;">this and other things</div>
</div>
<div id="cont">
</div>
</body>
</html>

页2

    <html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>page 1 test</title>
<script src="js/jquery-1.9.1.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#thisand').click(function() {
    $("#unhide").toggle('fast');
    alert ('im in')
});
});
</script>
</head>
<body>
<div id="res">
<input id="thisand" name="test but" type="button" value="Button" />
<div id="unhide" hidden="" style="background-color:#09F; width:100; height:100;">i     apppear</div>
</div>
</body>
</html>

如您所见，第 2 页中需要的 JavaScript 出现在第 1 页。请帮忙。

问题是您在$("#cont").load('testpage2.html #res')中使用了 id 选择器

jQuery只会加载第2页的那部分，因此不会加载Javascript。如果你删除id选择器，它将加载整个页面，包括Javascript。

$("#cont").load('testpage2.html')

或者，你可以把你的Javascript放在resdiv中，那么这应该可以工作。

附带说明一下，代码中缺少各种行尾分号，这并不好。

相关文章：