[英]Run a javascript when an element has loaded into the HTML page
我有一个脚本,可将一些HTML代码加载到<div id="nav">
元素中。
div元素位于index.html中。
加载脚本如下所示,并在加载index.html时运行。
$(document).ready(function () {
$('#nav').load('nav.html');
});
nav.html包含要加载到<div id="nav">
元素中的代码
nav.html:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>Nav</title>
<body>
<nav class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Brand</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li id="nav_item_start"><a href="index.html">Start</a></li>
<li id="nav_item_2"><a href="page2.html">page2</a></li>
<li id="nav_item_3"><a href="page3.html">page3</a></li>
<li id="nav_item_4"><a href="page4.html">page4</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li>
<button type="button" class="btn btn-default navbar-btn" onclick="increaseFontSize()">Ändra kontrast</button>
</li>
<li>
<button id="nav_signin" type="button" class="btn btn-default navbar-btn"
onclick="location.href='signin.html'">Logga
in
</button>
</li>
</ul>
</div>
</div>
</nav>
</body>
</html>
我希望在将nav.html代码加载到div元素后运行脚本。 是否有用于此问题的回调方法,或解决此问题的任何其他标准方法?
这是我要如上所述运行的JavaScript:
setTimeout(myFunction, 200);
function myFunction(){
//Manipulating the nav.html code
}
这种方法的问题在于,nav.html代码的加载可能需要200毫秒以上的时间,从而导致脚本无效。
非常感谢这里的任何帮助
马库斯
load()
方法的第二个参数是一个回调函数,它将在AJAX请求完成后执行。 尝试这个:
$('#nav').load('nav.html', function(){
//Manipulating the nav.html code
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.