Разделить и разобрать window.location.hash

Я столкнулся с проблемами с расщеплением и разбором window.location.hash правильно.

Прежде всего, мы получаем несколько параметров в хеш, ex:

#loc=austria&mr=1&min=10&max=89

Как вы наверняка видите, он был создан для поиска. Когда пользователь нажимает на страницу ссылок на страницы, перезагружается хешем. Пока все хорошо.

Я создал функцию initialise(), которая вызывает каждый раз, когда hash в URL-адресе:

if (window.location.hash) {
    var params = (window.location.hash.substr(1)).split("&");

    for (i = 0; i < params.length; i++)
    {
        var a = params[i].split("=");
        // Now every parameter from the hash is beind handled this way
        if (a[0] == "loc")
        {
            locationList(a[1]);
        }
    }
}

Everythig почти работает... Когда я выбираю все параметры поиска, хэш... режет. По неизвестной причине для меня. Я старался использовать if( params.indexOf('loc') ) вместо a[0] == "loc" без везения.

Не могли бы вы одолжить мне руку?

Edit
Конечно, я использовал var a =... в цикле, это была только ошибка копирования-вставки.

Ответ 1

Вам не нужен цикл, если это только значение loc из хеша. Это также должно работать.

var lochash    = location.hash.substr(1),
    mylocation = lochash.substr(lochash.indexOf('loc='))
                  .split('&')[0]
                  .split('=')[1];
if (mylocation) {
   locationList(myLocation);
}

Относительно транслирования хэша после перезагрузки страницы: imho, который не связан с вашим циклом.

Изменить Более современный и более точный подход:

const result = document.querySelector("#result");
const hash2Obj = "loc=austria&mr=1&min=10&max=89"
      .split("&")
      .map( el => el.split("=") )
      .reduce( (pre, cur) => { pre[cur[0]] = cur[1]; return pre; }, {} );

result.textContent += `loc => ${hash2Obj.loc}
----
*hash2Obj (stringified):
${JSON.stringify(hash2Obj, null, ' ')}`;

<pre id="result"></pre>

Ответ 2

Это должен быть более простой способ чтения из location.hash:

    var hash = window.location.hash.substring(1);
    var params = {}
    hash.split('&').map(hk => { 
      let temp = hk.split('='); 
        params[temp[0]] = temp[1] 
    });
    console.log(params); //Here are the params to use

а затем вы можете использовать

params.access_token //access_token 
params.id //id

и другие параметры, доступные внутри хэша

Ответ 3

Если вы используете jQuery, посмотрите плагин jQuery BBQ

Он "использует событие HTML5 hashchange", что в основном позволяет вам выполнить код JavaScript после изменения хэша.

Furthemore, он поставляется с мощной функцией depram ", которая позволяет вам" Разбирать строку запроса из URL-адреса или текущего окна .location, десериализация его в объект, необязательное принуждение чисел, булевых, нулевых и undefined значений. "

Ответ 4

params.indexOf('loc') не вернет значение, поскольку loc не существует в массиве params. Элемент, который вы ищете в представленном примере, loc=austria. Если вы выбираете только ключ, вам понадобится цикл для проверки каждой пары значений ключа.