Wie man mit Bootstrap-Caching-Problemen umgeht

Der Autor verwendet die Version von bootstrap.js v3.0.0, die mit VS2017MVC geliefert wird. Nach der Suche auf Baidu habe ich festgestellt, dass die modale Ladeseite schwerwiegende Probleme aufweist. Für viele ähnliche Situationen gibt es im Wesentlichen die folgenden zwei Lösungen:

Wenn Sie mehr über Bootstrap erfahren möchten, können Sie auf klicken: Bootstrap-Framework

1. Daten beim Schließen löschen:

 $("#myModal").on("hidden.bs.modal", function () {
        $(this).removeData("bs.modal");
    });

2. Ändern Sie die angeforderte URL unter der angeforderten URL. Fügen Sie einen Zeitstempel hinzu.

function remoteUrl(u){
	u += '&t=' + Math.random(1000)
    $.get(u, '', function(data){
        $('#remoteModal .modal-body').html(data)
    })
    $('#remoteModal').modal({show:true,backdrop:false})
}

Die beiden oben genannten Lösungen sind zwar effektiv, aber im IE ist die erste Methode ungültig und die zweite Methode zu umständlich zu lösen.

Ich habe auf Baidu eine andere Lösung speziell für IE gefunden:

[OutputCache(NoStore = true, Duration = 0, VaryByParam = "*")]//不加的话，IE缓存会捣乱

Diese Methode besteht darin, jede Aktion auf der Serverseite hinzuzufügen. In diesem Fall müssen die Aktionen hinzugefügt werden Der Autor ist tatsächlich der Meinung, dass der IE zu Quatsch ist und dass er sich aus der Internetbranche zurückziehen sollte.

Okay, ich bin fertig mit dem Erbrechen, hier ist meine Lösung: Ändern Sie direkt die bootstrap.js-Datei

etwa in Zeile 1068 wie folgt:

 $(document).on('click.bs.modal.data-api', '[data-toggle="modal"]', function (e) {
    var $this   = $(this)
    var href    = $this.attr('href')
    var $target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))) //strip for ie7
    var remoteUrl = !/#/.test(href) && href
    if (remoteUrl == undefined) {
        remoteUrl = "";
    }
    if (remoteUrl.indexOf("?") > -1) {
        remoteUrl += "&" + (new Date()).valueOf()
    }
    else {
        remoteUrl += "?" + (new Date()).valueOf()
    }
    //var option  = $target.data('modal') ? 'toggle' : $.extend({ remote: !/#/.test(href) && href }, $target.data(), $this.data())
    //上边的是原代码，增加了remoteUrl来解决IE下缓存的问题
    var option = $target.data('modal') ? 'toggle' : $.extend({ remote: remoteUrl }, $target.data(), $this.data())
    e.preventDefault()
    $target
      .modal(option, this)
      .one('hide', function () {
        $this.is(':visible') && $this.focus()
      })
  })

Die Kommentare haben es erklärt Die Lösung habe ich einfach remoteUrl hinzugefügt und die Zeit nach der angeforderten URL hinzugefügt, damit ich sie nicht einzeln ändern muss und jeden Browser berücksichtigen kann.

Das obige ist der detaillierte Inhalt vonWie man mit Bootstrap-Caching-Problemen umgeht. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!