Как вы можете проверить #hash в URL, используя JavaScript?

Question

У меня есть некоторый код jQuery JavaScript, который я хочу запускать, только когда в URL есть хеш-ссылка (#). Как вы можете проверить этот символ с помощью JavaScript? Мне нужен простой всеобъемлющий тест, который бы определял URL-адреса, подобные этим:

• example.com / page.html # якорь
• example.com / page.html # anotheranchor

В основном что-то вроде:

if (thereIsAHashInTheUrl) {        
    do this;
} else {
    do this;
}

Если бы кто-нибудь мог указать мне правильное направление, это было бы очень ценно.

Answer 1

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; 
  }
}

Answer 2

var requestedHash = ((window.location.hash.substring(1).split("#",1))+"?").split("?",1);

Answer 3

Замечания Партриджа и Гарета выше. Они заслуживают отдельного ответа. Очевидно, что свойства хеша и поиска доступны для любого html-объекта Link:

<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
}

(но, может быть, немного перестарались ..)

Answer 4

Добавьте сюда как метод для абстрагирования свойств местоположения от произвольных 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 -подобные объекты: Location.js

Answer 5

Обычно клики идут раньше, чем изменения местоположения, поэтому после клика хорошей идеей будет setTimeOut получить обновленный window.location.hash

$(".nav").click(function(){
    setTimeout(function(){
        updatedHash = location.hash
    },100);
});

или вы можете прослушать местоположение с помощью:

window.onhashchange = function(evt){
   updatedHash = "#" + evt.newURL.split("#")[1]
};

Я написал плагин jQuery , который делает что-то вроде что ты хочешь сделать.

Это простой якорный маршрутизатор.

Answer 6

Вот простая функция, которая возвращает 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.

Answer 7

Это простой способ проверить это для URL текущей страницы:

  function checkHash(){
      return (location.hash ? true : false);
  }

Answer 8

иногда вы получаете полную строку запроса, такую ​​как "#anchorlink? Firstname = mark"

это мой скрипт для получения хеш-значения:

var hashId = window.location.hash;
hashId = hashId.match(/#[^?&\/]*/g);

returns -> #anchorlink