Question

寻找一种方法，使用JavaScript / JQuery将URL的哈希/片段中的密钥对解析为对象/关联数组

Answer 1

function getHashParams() {

    var hashParams = {};
    var e,
        a = /\+/g,  // Regex for replacing addition symbol with a space
        r = /([^&;=]+)=?([^&;]*)/g,
        d = function (s) { return decodeURIComponent(s.replace(a, " ")); },
        q = window.location.hash.substring(1);

    while (e = r.exec(q))
       hashParams[d(e[1])] = d(e[2]);

    return hashParams;
}

不需要JQuery /插件

<强>更新

我现在按照Hovis的回答推荐jQuery BBQ plugin。它涵盖了所有哈希解析问题。

Answer 2

退房：jQuery BBQ

jQuery BBQ设计用于从url（查询字符串或片段）解析内容，并进一步简化基于片段的历史记录。这是Yarin在他整理一个纯粹的js解决方案之前所寻找的jQuery插件。具体来说，deparam.fragment()函数完成了这项工作。看看吧！

（我正在研究的支持网站使用异步搜索，因为BBQ使得将整个对象塞入片段变得微不足道，我使用它来“保留”我的搜索参数。这为我的用户提供了搜索的历史状态，并且还允许他们为有用的搜索添加书签。最重要的是，当QA发现搜索缺陷时，他们可以直接链接到有问题的结果！）

Answer 3

在纯Javascript中执行此操作：

var hash = window.location.hash.substr(1);

var result = hash.split('&').reduce(function (result, item) {
    var parts = item.split('=');
    result[parts[0]] = parts[1];
    return result;
}, {});

http://example.com/#from=2012-01-05&to=2013-01-01

变为

{from: '2012-01-05', to:'2013-01-01'}

Answer 4

我正在使用jQuery URL Parser库。

Answer 5

我正在查看这个问题的一堆答案，然后使用template<typename T1, int i> using BT = struct B<T1, std::integral_constant<int, i>>;一行将它们拼凑在一起：

reduce

这一行显然有很多事情发生。它可以像这样重写以澄清：

const hashObj = location.hash.replace('#', '').split('&').reduce((prev, item) => Object.assign({[item.split('=')[0]]: item.split('=')[1]}, prev), {});

Answer 6

使用URLSearchParams。浏览器覆盖范围：https://caniuse.com/#search=URLSearchParams。主要浏览器完全支持它。

如何阅读一个简单的键：

var parsedHash = new URLSearchParams(
    window.location.hash.substr(1) // skip the first char (#)
);

console.log(parsedHash.get('any_hash_key'));

查看上面链接的Mozilla文档，以查看该接口的所有方法。

Answer 7

我对this question的回答应该是你想要的：

url_args_decode = function (url) {
  var args_enc, el, i, nameval, ret;
  ret = {};
  // use the DOM to parse the URL via an 'a' element
  el = document.createElement("a");
  el.href = url;
  // strip off initial ? on search and split
  args_enc = el.search.substring(1).split('&');
  for (i = 0; i < args_enc.length; i++) {
    // convert + into space, split on =, and then decode 
    args_enc[i].replace(/\+/g, ' ');
    nameval = args_enc[i].split('=', 2);
    ret[decodeURIComponent(nameval[0])]=decodeURIComponent(nameval[1]);
  }
  return ret;
};

Answer 8

您还可以使用此scrolling table of contents示例中演示的.hash属性作为点击链接或locatioin。

Answer 9

此jquery API 解析哈希标记：https://jhash.codeplex.com/

// get the "name" querystring value
var n = jHash.val('name');

// get the "location" querystring value
var l = jHash.val('location');

// set some querystring values
jHash.val({
    name: 'Chris',
    location: 'WI'
});

Answer 10

您可能需要查看 jsuri 。它似乎对我有用。

使用JavaScript解析URL哈希/片段标识符

10 个答案: