2008-08-23 15 views
41

Я занимаюсь небольшим программированием и веб-работой в местном колледже. Работа, которая включает в себя поддержание очень большого и разрушающего душу веб-сайта, который состоит из hodge podge из VBScript, javascript, Dreamweaver, сгенерировал рывок и набор дополнений, которые различные коннекторы убедили их покупать на протяжении многих лет.Проблема с сафари на задней панели

Несколько дней назад мне позвонил «Сайт блокируется для людей, использующих Safari!». Итак, первый шаг загрузите Safari (v3.1.2), второй шаг - на сайт. Все работает нормально.

Короче говоря, я наконец-то выделил проблему, и это связано с кнопкой назад Safari. На веб-сайте используется javascript-меню fancy-pants, которое работает в каждом браузере, который я пробовал, включая Safari, в первый раз. Но в Safari, если вы следуете ссылке со страницы, а затем нажмите кнопку «Назад», меню перестает работать.

Я сделал урезанную веб-страницу, чтобы проиллюстрировать принцип.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head><title>Safari Back Button Test</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
</head> 
<body onload="alert('Hello');"> 
<a href="http://www.codinghorror.com">Coding Horror</a> 
</body> 
</html> 

Загрузите страницу, и вы увидите окно предупреждения. Затем перейдите по ссылке со страницы и нажмите кнопку «Назад». В IE и Firefox вы снова видите окно предупреждения, в Safari - нет.

После энергичного поиска в Интернете я обнаружил других с похожими проблемами, но не нашел удовлетворительных ответов. Поэтому мой вопрос заключается в том, как заставить мои страницы работать одинаково в Safari после того, как пользователь нажимает кнопку «Назад», как в других браузерах?

Если это глупый вопрос, пожалуйста, будьте осторожны, javascript для меня несколько новенький.

+0

Эй, авто, вы все это поняли? Я пробовал все решения ниже на iPads и iPod, и я не могу заставить Safari запускать JavaScript, когда клиент нажимает кнопку «Назад». (Я могу получить его, когда я попробую его с Safari на рабочем столе, но я не могу заставить его работать с мобильной версией Safari. С этим вы вообще работали?) – Sal 2012-08-15 23:22:43

+0

Проверьте ответ на вопрос [Mobile Safari (http://stackoverflow.com/questions/11979156/mobile-safari-back-button/12652160) – 2012-09-29 11:25:19

+0

Событие onload() не запускается в Safari, когда нажата кнопка «Назад». – 2014-05-15 08:45:18

ответ

3

Я понятия не имею, что вызывает проблему, но я знаю, кто может вам помочь. Safari построен на Webkit и не хватает Apple (кто не настолько общителен) Webkit team может знать, в чем проблема.

Это не глупый вопрос.

3

Я заметил нечто очень похожее. Я думаю, это потому, что Firefox и IE при возврате снова возвращают страницу с сервера, а Safari - нет. Вы пытались добавить заголовок страницы/нет заголовка кэша? Я собирался изучить это, когда обнаружил это поведение, но еще не успел.

7

IFrame решает эту проблему:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head><title>Safari Back Button Test</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
</head> 
<body onload="alert('Hello');"> 
<a href="http://www.codinghorror.com">Coding Horror</a> 
<iframe style="height:0px;width:0px;visibility:hidden" src="about:blank"> 
this prevents back forward cache 
</iframe> 
</body> 
</html> 
более

details

+1

Ссылка в этом ответе теперь сломана; вы можете найти [данные, заархивированные здесь] (http://web.archive.org/web/20070612072521/http://developer.apple.com/internet/safari/faq.html#anchor5). – 2011-01-21 02:40:01

18

решение IFrame Стефана работает, но если этого не достаточно элегантный, я считаю следующий JavaScript также решает эту проблему:

window.onunload = function(){}; 

То есть, если в вашем меню есть JavaScript, то вы можете также решить эту проблему с помощью JavaScript.

Идея определения обработчика события выгрузки из этой статьи Firefox 1.5: https://developer.mozilla.org/en/Using_Firefox_1.5_caching.

+0

У меня были проблемы с кнопкой «Назад» в Safari, хотя я использовал событие jQuery в формате $ (document) .ready. Я добавил этот код и решил проблему. – 2011-02-01 16:27:41

+0

Кажется, что этот вопрос и ответ по-прежнему актуальны. Когда вы рассматриваете причуды браузера, вы склонны думать только об IE, но «другие» (Webkit, Firefox) также имеют их, хотя и более незначительные, и более неуловимые ... – kasimir 2012-03-01 08:44:11

9

Просто поместите это в теге тела <body onunload="">

это заставит сафари, хром, FF перезагружать каждый раз, когда вы нажмете кнопку назад

8

Вот хорошее решение для Mobile Safari:

/*! Reloads page on every visit */ 
function Reload() { 
    try { 
     var headElement = document.getElementsByTagName("head")[0]; 
     if (headElement && headElement.innerHTML) 
      headElement.innerHTML += " "; 
     } catch (e) {} 
    } 

    /*! Reloads on every visit in mobile safari */ 
    if ((/iphone|ipod|ipad.*os 5/gi).test(navigator.appVersion)) { 
     window.onpageshow = function(evt) { 
      if (evt.persisted) { 
       document.body.style.display = "none"; 
       location.reload(); 
      } 
     }; 
    } 

(source)

Я изменил его в соответствии с моими потребностями, но, как и все в порядке. (раздражающий белый экран при обновлении, если вы его не модифицируете).

0

Была ли та же проблема на iPad.

Не так красиво, но это работает :). Как это работает.

Я понял, что на iPad Safari страница не была перезагружена при нажатии кнопки «Назад». Я помещаю счетчик каждую секунду на странице, и я сохраняю текущую временную метку.

Когда страница загружается, счетчик и время синхронизируются. На задней кнопке счетчик продолжается там, где он остановился, и между меткой времени и счетчиком есть промежуток. Если зазор превышает 500 мс, перезагрузите страницу.

В файле action.js

var showLoadingBoxSetIntervalVar; 
var showLoadingBoxCount = 0; 
var showLoadingBoxLoadedTimestamp = 0 

function showLoadingBox(text) { 

    var showLoadingBoxSetIntervalVar=self.setInterval(function(){showLoadingBoxIpadRelaod()},1000); 
    showLoadingBoxCount = 0 
    showLoadingBoxLoadedTimestamp = new Date().getTime(); 

    //Here load the spinner 

} 

function showLoadingBoxIpadRelaod() 
{ 
    //Calculate difference between now and page loaded time minus threshold 500ms 
    var diffTime = ((new Date().getTime()) - showLoadingBoxLoadedTimestamp - 500)/1000; 

    showLoadingBoxCount = showLoadingBoxCount + 1; 
    var isiPad = navigator.userAgent.match(/iPad/i) != null; 

    if(diffTime > showLoadingBoxCount && isiPad){ 
     location.reload(); 
    } 
} 
8

Пожалуйста, не следуют какой-либо из советов, который говорит вам, чтобы игнорировать кэш. Страницы кэшируются по какой-либо причине - чтобы улучшить работу пользователей. Методы, которые вы используете, ухудшат работу пользователя, поэтому, если вы не ненавидите своих пользователей, не делайте этого.

Правильное решение для Safari (Desktop и iOS) заключается в использовании события pageshow вместо события onload (см. https://developer.mozilla.org/en-US/docs/Using_Firefox_1.5_caching).

Событие pageshow будет срабатывать одновременно с ожидаемым событием onload, но оно также будет работать, когда страницы будут обслуживаться через кеш. Похоже, вы все равно хотите.

2
$(window).bind("pageshow", function(event) { 
    if (event.originalEvent.persisted) { 
    window.location.reload() 
    } 
}); 

Ответил недавно here по mshah.