在 url 中传递多个类似哈希的参数
我正在使用 jQuery 和 Ajax 构建一个动态网站。我已经使用历史记录插件解决了历史记录和后退按钮的问题。我想在 url 中传递多个类似哈希的参数，而无需在单击事件时重新加载整个页面。我想要类似的东西：
something.php#type=abc&id=123或something.php/?type=abc&id=123...
这可能是在 url 中传递和检索此类参数的最佳方法是什么？
<a href="#type=abc&id=123">Click</a>
if(type==abc && id==123)
{
do this..
}
通常我们会这样做，单击，但它会重新加载整个页面。
I am building a dynamic website using jQuery and Ajax. I have solved the problem of history and back button using the History Plugin. I want to pass multiple hash like parameters in url without reloading the whole page on click events. I want something like:
something.php#type=abc&id=123orsomething.php/?type=abc&id=123...
Which could be the best way to pass and retrieve such kinda paramters in url?
<a href="#type=abc&id=123">Click</a>
if(type==abc && id==123)
{
do this..
}
Normally we do this, <a href="something.php?type=abc&id=123">Click</a> but it reloads the whole page.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
哈希值具有技术上允许包含的有限字符集。如果您查看此处的 URL 规范，哈希值称为片段ID。以下是它可以包含的内容的语法：
fragmentid xalphas xalphas xalpha [ xalphas ] xalpha alpha | digit | safe | extra | escape safe $ | - | _ | @ | . | & | + | - extra ! | * | " | ' | ( | ) | , escape % hex hex alpha a | b | c | d | e | f | g | h | i | j | k | l | m | n | o | p | q | r | s | t | u | v | w | x | y | z | A | B | C | D | E | F | G | H | I | J | K | L | M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z digit 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9您会注意到可以有
&，但不能有=，除非您在设置哈希值时调用encodeURIComponent和decodeURIComponent，或者检索它。至于使用什么技术，这完全取决于你。如果您需要在哈希值中表示多个参数，您可以在哈希值中创建自己的小语法。我个人可能会像在查询字符串中一样用
&分隔值，但使用-而不是=。The hash value has a limited set of characters that are technically allowed to be in it. If you look at the URL spec here, the hash value is called a fragmentid. Here's the grammar for what it can contain:
fragmentid xalphas xalphas xalpha [ xalphas ] xalpha alpha | digit | safe | extra | escape safe $ | - | _ | @ | . | & | + | - extra ! | * | " | ' | ( | ) | , escape % hex hex alpha a | b | c | d | e | f | g | h | i | j | k | l | m | n | o | p | q | r | s | t | u | v | w | x | y | z | A | B | C | D | E | F | G | H | I | J | K | L | M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z digit 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9You will notice that you can have
&, but not=unless you call encodeURIComponent and decodeURIComponent on the hash value when setting it or retrieving it.As for what technique to use, it's really up to you. You can make your own little syntax in the hash value if you need to represent multiple parameters there. I personally would probably separate the values with
&just like in the query string, but use-instead of=.就 URI 而言，您实际上可以执行您所要求的操作。
@jfriend00 是正确的，因为您不能在给定哈希值的名称/值中使用“=”，但是，我认为他们误解了规范的实际含义。您也不能在 URL 的查询字符串的名称/值中使用“=”字符。为什么？因为它在表示键/值对时具有特殊含义。它在哈希（又名fragmentid）中具有相同的用途，这正是您在示例中使用它的方式。
如果您查看w3.org 媒体片段页面，第三句指出：
请注意，它表示您可以对 URI 的查询和哈希部分使用键/值对。如果您进一步查看页面，您会发现它描述的格式与您在fragmentid中使用的格式完全相同：
话虽这么说，JavaScript 没有内置的方法来以结构化的方式访问键/值对（就像它没有内置的方法来访问查询字符串的键/值对一样）。因此，您必须构建自己的函数才能做到这一点，StackOverflow 上还有其他几篇文章已经展示了如何做到这一点：
In terms of URIs, you actually can do what you're asking.
@jfriend00 is correct in that you can't use the "=" in the name/value of a given hash value, however, I think they've misread the spec as to what that actually means. You also can't use the "=" character in the name/value in the query string of a URL. Why? Because it has the special meaning in denoting a key/value pair. It serves the same purpose in the hash (aka fragmentid), which is exactly how you're using it in your example.
If you look at the w3.org page for media fragments, the third sentence states:
Notice it says you can use key/value pairs for both the query and the hash part of a URI. If you look further down in the page, you'll find that it describes the format exactly as you're using it in the fragmentid:
That being said, JavaScript does not have a built-in way to access the key/value pairs in a structured way (just like it doesn't have a built-in way to access the key/value pairs of the query string). So, you'd have to build your own function to do that, and there are a couple other posts on StackOverflow that already show how to do that: