我正在使用jquery的ajax函数来抓取页面片段并在页面的一部分中显示 - 这个片段包含html和对外部js文件的引用.
程序流程如下所示:
主页面调用 - >片段页面调用 - >通过脚本标签的各种大型js文件.
我在初始ajax调用时打开了缓存选项,以便缓存fragement页面(没有附加到url的唯一ID),但是当加载片段时,似乎jquery重写脚本URL以包含unix时间戳这样浏览器每次都会下载脚本的新副本.我正在调用的脚本大约250kb缩小了,这真的会损害用户体验,因为浏览器在被调用时会锁定.这是jquery的理想行为吗?有没有办法禁用网址重写?
非常感谢你的帮助
Bla*_*ise 11
这个解决方案不像默多克的解决方案那么糟糕:
$.ajaxPrefilter('script', function(options) {
options.cache = true;
});
Run Code Online (Sandbox Code Playgroud)
见http://api.jquery.com/jQuery.ajaxPrefilter/
看起来 jQuery 的 evalScript 函数让你很困惑......
jQuery 第 543 行:
function evalScript( i, elem ) {
if ( elem.src )
jQuery.ajax({
url: elem.src,
async: false,
dataType: "script"
});
else
jQuery.globalEval( elem.text || elem.textContent || elem.innerHTML || "" );
if ( elem.parentNode )
elem.parentNode.removeChild( elem );
}
Run Code Online (Sandbox Code Playgroud)
以下是所发生情况的细分:主页的 JS 调用:
$.ajax({
url:"frag.htm",
type:"GET",
success:callBackFunction
})
Run Code Online (Sandbox Code Playgroud)
并获取 frag.htm,其中包含如下内容:
<html><head><script src="test.js"></script></head><body>Content</body></html>
Run Code Online (Sandbox Code Playgroud)
然后你的回调函数被调用,它可能看起来像这样:
function callBackFunction(data){
$("#ajaxContent").html(data); // <- this is the beginning of your problems...
}
Run Code Online (Sandbox Code Playgroud)
当 jQuery 的 html(data) 函数被调用时,它会通过删除任何脚本标签来“清理” HTML,然后对每个标签调用 evalScript。正如您所看到的,evalScript 没有指定“cache:true”,因此当它通过 $.ajax 时,缓存为 null。当cache为null并且dataType为“script”时,jQuery设置cache=false。
因此,要避免这个问题,请尝试以下操作:
function callBackFunction(data){
var tempAJAX = $.ajax; // save the original $.ajax
$.ajax=function(s){ // wrap the old $.ajax so set cache to true...
s.cache=true;
tempAJAX(s); // call old $.ajax
}
$("#ajaxContent").html(data); // insert the HTML and download the <script>s
$.ajax = tempAJAX; // reset $.ajax to the original.
}
}
Run Code Online (Sandbox Code Playgroud)
在将“frag.htm”中的新 HTML 插入主页之前,我们拦截对 $.ajax 的所有调用,修改对象以包含 cache=true,然后在加载脚本后插入 HTML。
如果您有任何疑问,请告诉我。