ホームページ  >  記事  >  ウェブフロントエンド  >  ブートストラップがキャッシュの問題を処理する方法

ブートストラップがキャッシュの問題を処理する方法

藏色散人
藏色散人オリジナル
2020-12-07 09:12:542940ブラウズ

Bootstrap によるキャッシュの問題への対処方法: 1. 閉じるときにデータをクリアする; 2. 要求された URL を変更し、「function remoteUrl(u){. . .}"。

ブートストラップがキャッシュの問題を処理する方法

このチュートリアルの動作環境: Windows 7 システム、ブートストラップ バージョン 3.3.7、Dell G3 コンピューター。

Baidu で検索すると、同様の状況がたくさんあります。解決策は基本的に次のとおりです:

1. 閉じるときにデータを消去します:

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

2. 要求された内容を変更します。 URL、要求された URL にタイムスタンプを追加します。

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

上記の 2 つの解決策は確かに効果的ですが、IE では最初の方法は無効で、2 番目の方法は解決するのが面倒です。

Baidu で、特に IE 向けの別の解決策を見つけました:

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

この方法では、サーバー側で各アクションを追加します。この場合、追加するアクションはいくつ必要ですか?筆者は実際、IE はゴミすぎるのでインターネット業界を辞めるべきだと考えています。

オーケー、嘔吐は終わりました。これが私の解決策です。bootstrap.js ファイル

の 1068 行目あたりを次のように直接変更します。

  $(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()
      })
  })

コメントは説明済みです。解決策として、remoteUrl を追加し、要求された URL の後に時間を追加するだけなので、1 つずつ変更する必要がなく、各ブラウザーを考慮できるようになります。

推奨: 「bootstrap ビデオ チュートリアル 」「css ビデオ チュートリアル

以上がブートストラップがキャッシュの問題を処理する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。