Как проверить наличие #hash в URL-адресе с помощью JavaScript?

Question

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

• example.com/page.html#anchor
• example.com/page.html#anotheranchor

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

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

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

Answer 1

Простой:

if(window.location.hash) {
  // Fragment exists
} else {
  // Fragment doesn't exist
}

Answer 2

  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
  }

Answer 3

Поставьте следующее:

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

Answer 4

Если URI не является местоположением документа, этот фрагмент будет делать то, что вы хотите.

var url = 'example.com/page.html#anchor',
    hash = url.split('#')[1];

if (hash) {
    alert(hash)
} else {
    // do something else
}

Answer 5

Вы пробовали это?

if (url.indexOf("#") != -1)
{
}

(Где url очевидно, это URL-адрес, который вы хотите проверить.)

Answer 6

$('#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!
});

Это решит проблему ;)

Answer 7

window.location.hash 

вернет хэш-идентификатор

Answer 8

...или есть селектор jquery:

$('a[href^="#"]')

Answer 9

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

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

Answer 10

Большинству людей известны свойства URL в document.location.Это здорово, если вас интересует только текущая страница.Но вопрос заключался в возможности анализировать привязки на странице, а не на самой странице.

Большинство людей, похоже, упускает из виду, что те же самые свойства 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
   }
});

Answer 11

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 12

Комментарии Партриджа и Гарета выше великолепны.Они заслуживают отдельного ответа.Судя по всему, свойства хеша и поиска доступны для любого объекта 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 13

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

Answer 14

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

Answer 15

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

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

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

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

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

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

Answer 16

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

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

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

Answer 18

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

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

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

returns -> #anchorlink