Как выполнить js-функцию на основе url-хэша url#nameoffunction

#javascript #function #hash

#javascript #функция #хэш

Вопрос:

Я видел, что некоторые веб-сайты выполняют функцию JavaScript на основе has в URL. Например,

когда я обращаюсь http://domain.com/jobs#test

затем веб-сайт выполняет функцию, основанную на #test

Я могу сделать это, проверив location.href, но есть ли способ получше?

Ответ №1:

Это то, что я делаю:

 window.onload = function(){
    var hash = (window.location.hash).replace('#', '');
    if (hash.length == 0) {
        //no hash do something
    }
    else {
        //else do something with hash
    }
}

ДЕМОНСТРАЦИЯ: http://jsfiddle.net/maniator/XCjpy/show/#test
demo2: http://jsfiddle.net/maniator/XCjpy/show/
demo3: http://jsfiddle.net/maniator/XCjpy/show/#testing_again

Ответ №2:

Если вам не нужно поддерживать старые браузеры, такие как IE6 и IE7, вы можете использовать:

 window.onhashchange = function(){
  switch(location.hash) {
    case '#hash1':
      //do something
    break;
    case '#has2':
      //do something else
    break;
  }
}

Но если вам нужно поддерживать старые браузеры, вам нужно провести опрос:

 var oldHash = location.hash;
setInterval(function(){
  if(location.hash !== oldHash){
    oldHash = location.hash;
    //hash changed do something
  }
}, 120);

1. // Спасибо за ввод. Я не знал, что есть такое событие, но.. что я хочу сделать, так это выполнить функцию при onload или domready, проверив хэш-тег. Я протестировал это, но onhashchange не запускается, когда я обращаюсь к URL с прикрепленным хэш-тегом. Однако я ценю ваш вклад.

2. Что вы могли бы сделать, так это задать функцию, hashChanged которую вы используете для window.onhashchange = hashChanged . И вы вызываете ту же функцию hashChanged() в script теге в самом конце body тега

Ответ №3:

Живая демонстрация

 $(window).bind('hashchange', function() {
    var hash = document.location.hash;
    var func = hash.replace('#', '');
    eval(func   '()');
});

function asdf() {
    alert('asdf function');
}

function qwerty() {
    alert('qwerty function');
}

Примечание: eval() опасно. Вы должны создать заранее определенный массив безопасных функций и вызывать их.

Ответ №4:

Взгляните на это.
Смотрите таблицу свойств.
Расположение.хэш должен вам помочь.

Ответ №5:

Вы могли бы использовать библиотеку, подобную YUI, чтобы сделать это более элегантно, взгляните на YUI Browser History Manager

http://developer.yahoo.com/yui/history/