Получить определенную ценность хеширования от URL

StackOverflow https://stackoverflow.com/questions/3729150

  •  03-10-2019
  •  | 
  •  

Вопрос

В RAW JavaScript, как можно было бы проверить, что в URL существует определенный хеш-тег, а затем захватить значение?

Пример: http://www.example.com/index.html#hashtag1=value1&#hashtag2=value2.

Я хочу иметь возможность схватить ценность либо hashtag1. или hashtag2..

Это было полезно?

Решение

    var HashSearch = new function () {
       var params;

       this.set = function (key, value) {
          params[key] = value;
          this.push();
       };

       this.remove = function (key, value) {
          delete params[key];
          this.push();
       };


       this.get = function (key, value) {
           return params[key];
       };

       this.keyExists = function (key) {
           return params.hasOwnProperty(key);
       };

       this.push= function () {
           var hashBuilder = [], key, value;

           for(key in params) if (params.hasOwnProperty(key)) {
               key = escape(key), value = escape(params[key]); // escape(undefined) == "undefined"
               hashBuilder.push(key + ( (value !== "undefined") ? '=' + value : "" ));
           }

           window.location.hash = hashBuilder.join("&");
       };

       (this.load = function () {
           params = {}
           var hashStr = window.location.hash, hashArray, keyVal
           hashStr = hashStr.substring(1, hashStr.length);
           hashArray = hashStr.split('&');

           for(var i = 0; i < hashArray.length; i++) {
               keyVal = hashArray[i].split('=');
               params[unescape(keyVal[0])] = (typeof keyVal[1] != "undefined") ? unescape(keyVal[1]) : keyVal[1];
           }
       })();
    }

Используй это:

Проверьте, присутствует ли «хэш-ключ»:

 HashSearch.keyExists("thekey");

Получите значение для хеш-ключа:

 HashSearch.get('thekey');

Установите значение для хеш-ключа и обновите HASH URL:

 HashSearch.set('thekey', 'hey');

Удалить хеш-ключ от URL:

 HashSearch.remove('thekey');

Перезагрузить хеш в локальный объект:

 HashSearch.load();

Нажмите текущее значение ключа, установленного на URL-хеш:

 HashSearch.push();

Обратите внимание, что когда ключ не существует, и вы пытаетесь get Это вернутся undefined. Отказ Тем не менее, ключ может существовать без значения - например #key=val&novalue где Novalue является ключом без значения. Если вы сделаете HashSearch.get("novalue") Это также вернется undefined. Отказ В этом случае вы должны использовать HashSearch.keyExists("novalue") Чтобы убедиться, что это действительно ключ.

Другие советы

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

getURLHashParameter : function(name) {

        return decodeURI(
            (RegExp('[#|&]' + name + '=' + '(.+?)(&|$)').exec(location.hash)||[,null])[1]
        );
    }, 

window.location.hash должен дать вам то, что вы хотите.

jquery bbq (Назад кнопка и запрос) используют событие HTML5 Hashchange, чтобы позволить простую, но мощную историю #hask. Кроме того, jQuery BBQ предоставляет полный метод .Deparam () наряду с обоимным управлением HASH CASE, так и в разрыве фрагмента / запроса.

Короче говоря: эта библиотека позволяет динамически изменять хеш «Запрос строки» на вашу страницу и иметь соответствие URL. Это также позволяет вам динамически тянуть значения и нормализует работу с «строкой запроса». Наконец, он добавит строки запроса в историю, которая позволяет обратно кнопку функционировать в качестве навигации между предыдущими значениями HASH запроса.

Хороший ход для UX было бы, чтобы проверить библиотеку, как jquery bbq :)

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top