добавить хэш с помощью javascript к URL без прокрутки страницы?
-
10-07-2019 - |
Вопрос
добавить хэш к URL-адресу без прокрутки страницы?с помощью javascript
- я открываю страницу
- я прокручиваю страницу вниз
- я нажимаю на ссылку, которая добавляет хэш (возможно, со значением #test) (пример: http://www.example.com/#test)
- страница не ДОЛЖНА прокручиваться обратно к началу.
как это можно сделать?
примечание:просто проверяю, возможно ли отключить перемещение, даже если есть какой-то тег с id="test" пока возвращаемое значение false;работает нормально (для поддержки пользователей без javascript), а также для того, чтобы избежать присутствия идентификаторов в html, но это не проблема с такими вещами, как числа, такие как 1, 2, 3 (они в любом случае не разрешены в качестве идентификаторов)
все ответы замечательные, ничего нового или новаторского, и никаких решений о том, как нарушить функциональность по умолчанию, но это сойдет.:) спасибо, что нашли время ответить.
Решение
Любой хэш, которого нет на странице, должен приводить к такому поведению.Например, эта ссылка указывает на несуществующий хэш на этой странице.(Ссылка протестирована с Chrome 2.0 и IE 6 (единственными браузерами, доступными мне на данный момент).)
Поэтому, если ваш URL-адрес заставляет вас переходить в начало страницы, убедитесь, что у вас нет ничего на странице, чей идентификатор или имя соответствует этому адресу.
Другие советы
Любой из приведенных ниже примеров должен делать то, что вы хотите:
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<a href="pleaseEnableJS.html"
onclick="window.location.hash = '#test1';return false;">Test 1</a>
<a href="#test2">Test 2</a>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
Если есть какой-либо элемент с id="test1"
или id="test2"
или <a name="test1"></a>
или <a name="test2"></a>
на вашей странице он будет прокручиваться до этого элемента, в противном случае он должен работать так, как вы просили.
Если у вас есть код, который работает не так, как ожидалось, пожалуйста отредактируйте свой вопрос и включите небольшой пример HTML и JavaScript, которые работают не так, как ожидалось.
Каждый браузер будет интерпретировать хэш-значение как "перейти к этому идентификатору DOM".Вы могли бы попробовать две вещи, о которых я могу подумать:
Сделайте так, чтобы действие, добавляющее хэш, возвращало значение false, тем самым отключив необходимость браузера искать его
Добавьте тег DOM с идентификатором хэша, который вы добавляете, прямо там, где находится щелчок, чтобы остановить перемещение браузера.Но, вероятно, это не то, что вы хотите, поскольку вы добавляете хэш для чего-то.
Ответ Уэлбога работает нормально, но оставляет #nonexistantanchor
хэш в адресной строке браузера.
Чтобы сделать это с помощью jQuery, вы можете добавить класс к привязке и использовать предотвратить дефолт способ отключить как навигацию, так и изменение URL-адреса.
<a href='#' class="nodefault">Clickable</a>
<script>
$("a.nodefault").click(function(event) {
event.preventDefault();
});
</script>
Конечно, эстетическая дилемма теперь заключается в том, что предпочтительнее: элегантный URL-адрес или решение без javascript.