location.hash, кажется, полностью сломан в Safari 4: он может быть установлен изначально, но не может быть установлен в любом случае, насколько я могу сказать, вызвано ли это событие пользователем действие или таймер.location.hash oddness в Safari 4
Вот пример (я использую JQuery здесь для краткости, но я не могу себе представить, что эта проблема является JQuery конкретным):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<!-- Include jQuery -->
</head>
<body>
<div id="test">Click the link below to make this text bold.</div>
<p><a href="#test">Bold it!</a></p>
<p id="hashValue"></p>
<script>
$(document).ready(function() {
location.hash = '#normal'; // this works in all browsers
$('a').click(function() {
$('#test').css({'font-weight': 'bold'});
location.hash = '#bold'; // this fails in Safari 4
return false; // prevents link href from affecting hash
});
setInterval(function() {
if (! location.hash.match('bold$')) {
$('#test').css({'font-weight': 'normal'});
}
$('#hashValue').html(location.hash);
}, 100);
});
</script>
</body>
</html>
В Firefox, поведение, что вы ожидаете: Когда вы загружаете страницу, хэш установлен на #normal. Когда вы нажимаете на ссылку, текст становится полужирным, а хэш - #bold
. Поскольку хэш был изменен, функция интервала не действует. Если вы измените хэш в адресной строке на что-то еще (это не заканчивается на bold
), текст становится полужирным. Это позволяет обратной кнопке работать интуитивно: щелкните назад, где хеш #bold
, и текст становится полужирным. Нажмите в другом месте, и текст не выделен жирным шрифтом.
Но в Safari 4 поведение: при загрузке страницы хэш установлен на #normal. И тогда это останется навсегда, насколько это касается адресной строки. Когда вы нажмете ссылку, текст станет жирным и останется таким, хотя хэш в адресной строке не изменился. Таким образом, location.hash изменяется внутренне (как отражает абзац hashValue
). Эта несогласованность с адресной строкой имеет ужасные последствия: если вы нажмете кнопку «Назад», текст не будет выделен полужирным шрифтом; но если вы нажмете кнопку «вперед» после этого, она не будет выделена полужирным шрифтом! Это полностью разрушает библиотеки истории JavaScript, такие как jQuery history plugin.
Любые исправления? Любые обходные пути? Я тестировал это в Safari 4.0.1 на Mac.
Работает для меня (Safari 4.0.1 Mac). Вы хотите опубликовать ссылку на версию, которая не работает? – Miles