Как вы можете проверить #хэш в URL-адресе с помощью JavaScript?
У меня есть код JavaScript jQuery, который я хочу запускать только тогда, когда в URL-адресе есть привязка хэша ( # ). Как вы можете проверить этот символ с помощью JavaScript? Мне нужен простой тест catch-all, который будет обнаруживать такие URL-адреса:
- example.com/page.html#anchor
- example.com/page.html#anotheranchor
в основном что-то вроде:
if (thereIsAHashInTheUrl) {
do this;
} else {
do this;
}
Если бы кто-нибудь мог указать мне в правильном направлении, это было бы будьте очень благодарны.
18 ответов:
if(window.location.hash) { var hash = window.location.hash.substring(1); //Puts hash in variable, and removes the # character alert (hash); // hash found } else { // No hash found }
пишем следующее:
<script type="text/javascript"> if (location.href.indexOf("#") != -1) { // Your code in here accessing the string like this // location.href.substr(location.href.indexOf("#")) } </script>
Если URI не является местоположением документа, этот фрагмент будет делать то, что вы хотите.
var url = 'example.com/page.html#anchor', hash = url.split('#')[1]; if (hash) { alert(hash) } else { // do something else }
вы пробовали это?
if (url.indexOf("#") != -1) { }(где
url- это URL-адрес, который вы хотите проверить, очевидно.)
$('#myanchor').click(function(){ window.location.hash = "myanchor"; //set hash return false; //disables browser anchor jump behavior }); $(window).bind('hashchange', function () { //detect hash change var hash = window.location.hash.slice(1); //hash to string (= "myanchor") //do sth here, hell yeah! });Это решит проблему ;)
вот что вы можете сделать, чтобы периодически проверять изменение хэша, а затем вызвать функцию для обработки значения хэша.
var hash = false; checkHash(); function checkHash(){ if(window.location.hash != hash) { hash = window.location.hash; processHash(hash); } t=setTimeout("checkHash()",400); } function processHash(hash){ alert(hash); }
большинство людей знают о свойствах URL в документе.местоположение. Это здорово, если вас интересует только текущая страница. Но вопрос был в том, чтобы иметь возможность анализировать якоря на странице, а не на самой странице.
то, что большинство людей, кажется, пропустить, что те же свойства URL также доступны для привязки элементов:
// To process anchors on click jQuery('a').click(function () { if (this.hash) { // Clicked anchor has a hash } else { // Clicked anchor does not have a hash } }); // To process anchors without waiting for an event jQuery('a').each(function () { if (this.hash) { // Current anchor has a hash } else { // Current anchor does not have a hash } });
Партридж и Гарет комментарии выше велики. Они заслуживают отдельного ответа. По-видимому, свойства хэша и поиска доступны на любом объекте ссылки html:
<a id="test" href="foo.html?bar#quz">test</a> <script type="text/javascript"> alert(document.getElementById('test').search); //bar alert(document.getElementById('test').hash); //quz </script>или
<a href="bar.html?foo" onclick="alert(this.search)">SAY FOO</a>Если вам это нужно в обычной строковой переменной и у вас есть jQuery, это должно работать:
var mylink = "foo.html?bar#quz"; if ($('<a href="'+mylink+'">').get(0).search=='bar')) { // do stuff }(но его, возможно, немного перестарались .. )
бросая это здесь как метод для абстрагирования свойств местоположения из произвольных URI-подобных строк. Хотя
window.location instanceof Locationверно, любая попытка вызватьLocationскажет вам, что это незаконный конструктор. Вы все еще можете добраться до таких вещей, какhash,query,protocolи т. д., установив строку в качествеhrefсвойство якорного элемента DOM, который затем будет совместно использовать все свойства адреса сwindow.location.простой способ сделать это это:
var a = document.createElement('a'); a.href = string; string.hash;для удобства я написал небольшую библиотеку, которая использует это, чтобы заменить родной
Locationконструктор с одним, который будет принимать строки и производитьwindow.locationобъекты: расположение.js
function getHash() { if (window.location.hash) { var hash = window.location.hash.substring(1); if (hash.length === 0) { return false; } else { return hash; } } else { return false; } }
обычно щелчки идут первыми, чем изменения местоположения, так что после щелчка это хорошая идея, чтобы setTimeOut чтобы получить обновленное окно.местоположение.хэш
$(".nav").click(function(){ setTimeout(function(){ updatedHash = location.hash },100); });или вы можете слушать расположением:
window.onhashchange = function(evt){ updatedHash = "#" + evt.newURL.split("#")[1] };Я написал плагин jQuery что делает что-то вроде то, что ты хочешь сделать.
это простой якорный маршрутизатор.
вот простая функция, которая возвращает
trueилиfalse(имеет / не имеет хэштегом):var urlToCheck = 'http://www.domain.com/#hashtag'; function hasHashtag(url) { return (url.indexOf("#") != -1) ? true : false; } // Condition if(hasHashtag(urlToCheck)) { // Do something if has } else { // Do something if doesn't }возвращает
trueв этом случае.на основе комментария @jon-skeet.
Это простой способ проверить это для текущей страницы URL:
function checkHash(){ return (location.hash ? true : false); }
иногда вы получаете полную строку запроса, такую как " #anchorlink?имя=Марк"
Это мой скрипт для получения хэш-значения:
var hashId = window.location.hash; hashId = hashId.match(/#[^?&\/]*/g); returns -> #anchorlink
Comments