我正在使用jquery的ajax函数来抓取页面片段并显示在页面的一部分中-该片段包括html和对外部js文件的引用。
程序流程如下所示:
主页调用->通过脚本标签调用->各种大型js文件的片段页面。
我在最初的ajax调用中打开了cache选项,以便缓存碎片页面(没有唯一的ID附加到url),但是在加载片段时,jquery似乎重写了脚本url以包含unix时间戳以便浏览器每次都下载脚本的新副本。我正在调用的脚本大约压缩了250kb,这确实在损害用户体验,因为无论何时调用浏览器,它们都会锁定。这是jQuery的理想行为吗?有没有办法禁用URL重写?
非常感谢您的帮助
看起来jQuerys的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 ); }
这是发生的情况的细分:主页的JS调用:
$.ajax({ url:"frag.htm", type:"GET", success:callBackFunction })
和GET frag.htm,其中包含以下内容:
<html><head><script src="test.js"></script></head><body>Content</body></html>
然后您的回调函数将被调用,看起来像这样:
function callBackFunction(data){ $("#ajaxContent").html(data); // <- this is the beginning of your problems... }
当调用jQuery的html(data)函数时,它会通过删除任何脚本标签来“清理” HTML,然后在每个脚本标签上调用evalScript。如您所见,evalScript没有指定“ cache:true”,因此当它通过$ .ajax时,缓存为空。当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. } }
在将新的HTML文件从“ frag.htm”插入主页之前,我们将拦截对$ .ajax的所有调用,将对象修改为包括cache = true,然后在加载脚本后插入HTML。
如果您有任何疑问,请告诉我。