Javascript 单击几下后,加载函数会变慢
我正在尝试将不同的外部HTMl文件加载到父HTMl中的一个DIV中。这是我正在使用的代码Javascript 单击几下后,加载函数会变慢,javascript,jquery,html,Javascript,Jquery,Html,我正在尝试将不同的外部HTMl文件加载到父HTMl中的一个DIV中。这是我正在使用的代码 <!DOCTYPE html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title>BeautyDish Photography | Wedding and Beauty Photographer<
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>BeautyDish Photography | Wedding and Beauty Photographer</title>
<meta name="">
<meta name="keywords" content="">
<meta name="viewport" content="width=device-width">
<!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
</head>
<body>
<div id="wrapper" style=" max-width:1920px; min-width:1024px;">
<nav>
<div id='MainMenu'>
<a href="home">Home</a>
<a href="aboutus" id="aboutus">About Us</a>
<a href="portfolio" id="portfolio">Portfolio</a>
<a href="contactus" id="contactus">Contact Us</a>
</div>
</nav>
<div id="content" style="width:1200px; padding:0; margin:auto;">ff
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="js/main.js"></script>
<script>
$(function(){
$("#MainMenu a").click(function(e) {
//load home.html on click
e.preventDefault();
$("#content").load($(this).attr('href')+".html", null, function(){
alert('Load Done');
});
});
});
</script>
</body>
</html>
BeautyDish摄影|婚礼和美容摄影师
ff
$(函数(){
$(“#主菜单a”)。单击(功能(e){
//单击后加载home.html
e、 预防默认值();
$(“#content”).load($(this.attr('href')+”.html),null,function(){
警报(“加载完成”);
});
});
});
每当我第一次单击任何链接时,它都能正常工作,从第二次单击开始,加载时间会更长,并且警报会不止一次出现。
我还主持了一个工作版本在
我是jQuery新手,请告诉我如何解决此问题。问题似乎是您正在将整个页面加载到一个div中 它包含在脚本和事件绑定中,这只会让事情变得更糟
一个解决方案是将你真正感兴趣的部分(另一页)缩减到你真正感兴趣的部分。但是这个解决方案必须针对您的实际需要而设计,这一点还不清楚。问题似乎是您正在将整个页面加载到一个div中 它包含在脚本和事件绑定中,这只会让事情变得更糟
一个解决方案是将你真正感兴趣的部分(另一页)缩减到你真正感兴趣的部分。但此解决方案必须针对您的实际需要而设计,这一点尚不清楚。在加载之前,您可以先执行删除操作,因为它会在中加载多个文件
$('#wrapper #content').remove();
$('#wrapper').append('<div id="#content"></div>')
$(“#包装器#内容”).remove();
$(“#包装器”).append(“”)
在加载之前,您可以先执行删除操作,因为它会在中加载多个文件
$('#wrapper #content').remove();
$('#wrapper').append('<div id="#content"></div>')
$(“#包装器#内容”).remove();
$(“#包装器”).append(“”)
通过.load()
加载的每个页面都包含相同的main.js脚本(http://www.jbasuphotography.com/js/main.js
)。@j08691 u是正确的。这是我的错。这就是实际情况。单击“主页”链接时如何卸载所有内容通过加载的每个页面。加载()
包含相同的main.js脚本(http://www.jbasuphotography.com/js/main.js
)。@j08691 u是正确的。这是我的错。这就是实际发生的情况。单击“主页”链接时如何卸载所有内容这解决了我的问题。每次切换页面时,我都会加载$.ajax()
。这解决了我的问题。每次切换页面时,我都会加载$.ajax()
。