Maison >interface Web >Tutoriel d'amorçage >Comment bootstrap gère les problèmes de mise en cache
Comment bootstrap gère les problèmes de mise en cache : 1. Effacez les données lors de la fermeture ; 2. Modifiez l'URL demandée et ajoutez un horodatage à l'URL demandée, avec des instructions telles que "function remoteUrl(u){. ..}" .
L'environnement d'exploitation de ce tutoriel : système Windows 7, version bootsrap 3.3.7, ordinateur Dell G3.
Après une recherche sur Baidu, il existe de nombreuses situations similaires. Les solutions sont essentiellement les suivantes :
1 Effacer les données lors de la fermeture :
$("#myModal").on("hidden.bs.modal", function () { $(this).removeData("bs.modal"); });
2. URL, ajoutez un horodatage à l'URL demandée.
function remoteUrl(u){ u += '&t=' + Math.random(1000) $.get(u, '', function(data){ $('#remoteModal .modal-body').html(data) }) $('#remoteModal').modal({show:true,backdrop:false}) }
Les deux solutions ci-dessus sont en effet efficaces, mais dans IE, la première méthode n'est pas valide et la seconde méthode est trop lourde à résoudre.
J'ai trouvé une autre solution sur Baidu, spécifiquement pour IE :
[OutputCache(NoStore = true, Duration = 0, VaryByParam = "*")]//不加的话,IE缓存会捣乱
Cette méthode consiste à ajouter chaque action côté serveur. Dans ce cas, combien d'actions doivent être ajoutées ? L'auteur pense en fait qu'IE est trop nul et devrait quitter l'industrie Internet.
Bon, assez de vomissements, voici ma solution : modifier directement le fichier bootstrap.js
vers la ligne 1068, comme suit :
$(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() }) })
Les commentaires ont expliqué la solution. J'ai juste ajouté remoteUrl et ajouté l'heure après l'url demandée, pour ne pas avoir à la modifier une à une et pouvoir prendre en compte chaque navigateur.
Recommandé : "Tutoriel vidéo bootstrap" "Tutoriel vidéo CSS"
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!