Html包含另一个带有onclick的Html javascript在页面加载后不起作用

Html include another Html with onclick javascript is not working after page load

本文关键字:Html 加载 不起作用 另一个 包含 onclick javascript      更新时间:2023-09-26

例如,Having 1st Page HTML Include header Page HTML

第1页javascript

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script> 
   $(function(){
     $("#header").load("Header.html");
   });
</script>
<div id="header"></div>

首页

<a href="#" data-toggle="dropdown" class="dropdown-toggle">Booking
<span class="caret"></span></a>
<ul class="dropdown-menu">
    <li><a id="booking" href="#">New Booking</a></li>
    <li id="cancel"><a href="url">Cancellation</a></li>
    <li id="my_booking"><a href="url">My Booking</a></li>
</ul>
</li>

所以我的问题是,在我的标题页HTML中,我有一个菜单下拉列表。在页面加载过程中,我可以点击菜单下拉列表。页面完全加载到页面1后,菜单出现故障,单击后没有响应。

您可以使用w3-include html来包含header.html

 <!DOCTYPE html>
<html>
<script src="http://www.w3schools.com/lib/w3data.js"></script>
<body>
<div w3-include-html="header.html"></div>
<script>
    w3IncludeHTML();
</script>
</body>
</html> 

您可以通过w3简单代码将其包括在内:

<!-- mport the libraries: -->
<script src="http://www.w3schools.com/lib/w3data.js"></script>
<!-- include the page: -->
<div w3-include-html="Header.html"></div>
<script>
w3IncludeHTML();
</script>

更多

您可能需要等到文档准备好。

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script> 
   $(document).ready
   (
       function ()
       {
           $(function(){
               $("#header").load("Header.html");
           });
       }
   )
</script>
<div id="header"></div>