jquery - 如何加快对同一 div 的顺序 JQuery load() 请求

标签 jquery ajax menu load

我有两个链接

<a href="page1.html">page 1</a>
<a href="page2.html">page 2</a>

<div id="content">&nbsp;</div>

1. 单击链接时,我使用 JQuery 将它们加载到 Div 中。

$('#content').load('page1.html');

2. 当单击第二个链接时,我会清空 div

$('#content').html('');

3.并加载第二个文件;

$('#content').load('page2.html');

问题,page1.html中有很多图像,即使单击第二个链接并且#content div被清空后,浏览器仍不断从page1.html下载图像,这显着减慢对 page2.html 的请求。

如何阻止第一次 load() 中的内容向浏览器发出请求并加快页面响应速度?

谢谢无限!

最佳答案

我认为您无法使用负载。我想你需要使用ajax function .

来自文档:

$.ajax() returns the XMLHttpRequest that it creates. In most cases you won't need that object to manipulate directly, but it is available if you need to abort the request manually.

代码更多,但应该不会那么糟糕。您可能需要调整此代码(未经测试),但我认为这个概念会起作用。

var xhr;

$("a").click(function() { 
  if(xhr !== undefined) { xhr.abort(); } 
  xhr = $.ajax({
    url: this.href,
    success: function(data) {
       $("#content").html(data);
    }
  });
});

关于jquery - 如何加快对同一 div 的顺序 JQuery load() 请求,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1285242/

相关文章:

php - 如何使用 Ajax 在页面上显示 PHP 服务器端验证消息

javascript - 从 Jquery 数据表中的超链接单击检索行元素数据

javascript - 停止书写后输入文本后触发 Action ?

javascript - 访问另一个 JS 文件中的数组 - Chrome 扩展

javascript - 水平下拉菜单鼠标悬停问题

css - 鼠标悬停时子菜单不可见

android - 菜单(三个点)没有出现在模拟器中,但在工作室中可见

javascript - D3 鼠标悬停事件未在底部元素上触发

javascript - AJAX 函数没有从它调用的函数接收返回数据

javascript - ajax 成功后循环 JSON 响应