阻止jQuery .load响应被缓存

Question

我有以下代码在URL上发出GET请求:

$('#searchButton').click(function() {
    $('#inquiry').load('/portal/?f=searchBilling&pid=' + $('#query').val());            
});

但返回的结果并不总是反映出来.例如,我更改了堆栈跟踪的响应,但是当我单击搜索按钮时没有出现堆栈跟踪.我查看了控制ajax响应的底层PHP代码,它有正确的代码,直接访问页面显示正确的结果,但.load返回的输出是旧的.

如果我关闭浏览器并重新打开它,它会工作一次,然后开始返回陈旧的信息.我可以通过jQuery控制它,还是需要我的PHP脚本输出头来控制缓存？

Answer 1

您必须使用更复杂的功能,例如,$.ajax()如果要基于每个请求控制缓存.或者,如果您只想将其关闭,请将其放在脚本的顶部:

$.ajaxSetup ({
    // Disable caching of AJAX responses
    cache: false
});

Answer 2

以下是如何基于每个请求控制缓存的示例

$.ajax({
    url: "/YourController",
    cache: false,
    dataType: "html",
    success: function(data) {
        $("#content").html(data);
    }
});

Answer 3

一种方法是在URL的末尾添加一个唯一的数字:

$('#inquiry').load('/portal/?f=searchBilling&pid=' + $('#query').val()+'&uid='+uniqueId());

你在每次调用时写下uniqueId()来返回不同的东西.

Answer 4

另一种方法是仅在需要从服务器获取数据时放置以下行,将下面的行与您的ajax URL一起添加.

'？_ =' + Math.round(的Math.random()*10000)

Answer 5

/**
 * Use this function as jQuery "load" to disable request caching in IE
 * Example: $('selector').loadWithoutCache('url', function(){ //success function callback... });
 **/
$.fn.loadWithoutCache = function (){
 var elem = $(this);
 var func = arguments[1];
 $.ajax({
     url: arguments[0],
     cache: false,
     dataType: "html",
     success: function(data, textStatus, XMLHttpRequest) {
   elem.html(data);
   if(func != undefined){
    func(data, textStatus, XMLHttpRequest);
   }
     }
 });
 return elem;
}

Answer 6

Sasha是个好主意,我使用混合物.

我创建了一个函数

LoadWithoutCache: function (url, source) {
    $.ajax({
        url: url,
        cache: false,
        dataType: "html",
        success: function (data) {
            $("#" + source).html(data);
            return false;
        }
    });
}

并调用我的页面的不同部分,例如在init上:

Init:function(actionUrl1,actionUrl2,actionUrl3){

var ExampleJS = {

Init: function (actionUrl1, actionUrl2, actionUrl3)           ExampleJS.LoadWithoutCache(actionUrl1, "div1");

ExampleJS.LoadWithoutCache(actionUrl2,"div2"); ExampleJS.LoadWithoutCache(actionUrl3,"div3"); },