Как я могу удалить хеш местоположения, не заставляя страницу прокрутить?

Действительно ли возможно удалить хеш из window.location не вызывая страницу к прокрутке перехода к вершине? Я должен смочь изменить хеш, не вызывая переходов.

У меня есть это:

$('').text('link').click(function(e) {
  e.preventDefault();
  window.location.hash = this.hash;
}).appendTo('body');

$('').text('unlink').click(function(e) {
  e.preventDefault();
  window.location.hash = '';
}).appendTo('body');

Посмотрите живой пример здесь: http://jsbin.com/asobi

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

Но то, когда пользовательские щелчки 'удаляют связь', имеет тег, удален и переходы прокрутки страницы к вершине. Я должен удалить хеш без этого побочного эффекта.

76
задан Andy E 3 April 2012 в 08:41
поделиться

5 ответов

Первые два вызова функции эквивалентны. Они вызывают метод foo 's bar в контексте foo - поэтому значение, возвращаемое this.x , является значением свойства foo x , которое равно 20 .

Оба вторых вызова являются сомнительным/недопустимым синтаксисом. Попробуйте запустить свой код через JSLint , и вы увидите, что он выплеснет несколько ошибок, а затем полностью подавится. Мое лучшее предположение, почему они возвращают 10 , заключается в том, что это попытка проанализировать ваш код в случае, когда он действительно не должен и путается. 10 может быть возвращено, поскольку браузер не может выяснить, что вы пытаетесь сделать, и по умолчанию используется глобальная (оконная) область, где значение x равно 10 . Это также объясняет замечание Рамеша Вэла о том, что два вторых значения отображаются как undefined в IE. Из-за того, что синтаксис недействителен, различные реализации JavaScript, скорее всего, будут обрабатывать их по-разному.

-121--3702130-

Ваш пример фактически не преобразовал входные данные в эквивалентное иррациональное выражение , а в эквивалентное иррациональное выражение . Как показывает обратный символьный калькулятор, в данном примере существует много возможных иррациональных выражений в пределах допуска десятичного числа, и будет столько же иррациональных выражений в пределах любой степени допуска любого указанного десятичного числа. Все это связано с плотностью иррациональности вдоль числовой линии.

Поэтому, чтобы ответить на ваши вопросы:

  • я бы ограничился рядом терминов, таких как sqrt (2), sqrt (3), sqrt (малые простые числа), e, pi и целые числа, плюс рациональные с малыми простыми знаменателями и аппроксимировать десятичные с несколькими терминами на основе этих плюс четыре основных арифметических оператора;
  • Вам решать. В общем, хотя, я думаю, что будет невозможно найти алгоритм для определения канонического представления любой десятичной дроби как ряда иррациональных членов и целых чисел, по той простой причине, что такого канонического представления не существует.

Но тогда мои реальные и иррациональные математики очень ржавые, я с нетерпением жду доказательств того, что я не прав, и контрпримеров.

-121--4407323-

Я верю, что если просто поместить фиктивный хэш, он не будет прокручиваться, так как нет соответствия для прокрутки.

<a href="#A4J2S9F7">No jumping</a>

или

<a href="#_">No jumping</a>

«#» само по себе эквивалентно «_ top» , что вызывает прокрутку к верхней части страницы

95
ответ дан 24 November 2019 в 11:15
поделиться

Свойство хэша window.location глупо в нескольких отношениях. Это один из них; другой - это то, что у него разные значения get и set:

window.location.hash = "hello";  // url now reads *.com#hello
alert(window.location.hash);   // shows "#hello", which is NOT what I set.
window.location.hash = window.location.hash; // url now reads *.com##hello

Обратите внимание, что установка для свойства hash значения '' также удаляет хэш-метку; вот что перенаправляет страницу. Чтобы установить значение хэш-части URL-адреса равным '', оставив хеш-метку и, следовательно, не обновляя, напишите следующее:

window.location.href = window.location.href.replace(/#.*$/, '#');

Невозможно полностью удалить хеш-метку, однажды установленную, без обновления страницы.

ОБНОВЛЕНИЕ 2012:

Как отметили Blazemonger и thinkdj, технология улучшилась. Некоторые браузеры позволяют очистить этот хэштег, а некоторые - нет. Чтобы поддержать оба варианта, попробуйте что-нибудь вроде:

if ( window.history && window.history.pushState ) { 
    window.history.pushState('', '', window.location.pathname) 
} else { 
    window.location.href = window.location.href.replace(/#.*$/, '#'); 
}
18
ответ дан 24 November 2019 в 11:15
поделиться

Установка window.location.hash в пустое или несуществующее имя якоря, всегда будет заставлять страницу прыгать к вершине. Единственный способ предотвратить это - захватить позицию прокрутки окна и снова установить ее в эту позицию после изменения хэша.

Это также заставит страницу перерисовываться (этого не избежать), хотя, поскольку это выполняется в одном js-процессе, он не будет прыгать вверх/вниз (теоретически).

$('<a href="#123">').text('link').click(function(e) {
    e.preventDefault();
    window.location.hash = this.hash;
}).appendTo('body');

$('<a href="#">').text('unlink').click(function(e) {
    e.preventDefault();
    var pos = $(window).scrollTop(); // get scroll position
    window.location.hash = '';
    $(window).scrollTop(pos); // set scroll position back
}).appendTo('body');

Надеюсь, это поможет.

2
ответ дан 24 November 2019 в 11:15
поделиться

Я не уверен, дает ли это желаемый результат, дайте ему выстрел:

$('<a href="#">').text('unlink').click(function(e) {
    e.preventDefault();
    var st = parseInt($(window).scrollTop())
    window.location.hash = '';
    $('html,body').css( { scrollTop: st });  
});

В основном сохраните смещение прокрутки и восстановите его после назначения пустого хеша.

1
ответ дан 24 November 2019 в 11:15
поделиться

Вы пробовали вернуть false; в обработчике событий? jQuery делает что-то особенное, когда вы это делаете, похоже, но AFAIK более эффективен, чем e.preventDefault .

1
ответ дан 24 November 2019 в 11:15
поделиться
Другие вопросы по тегам:

Похожие вопросы: