我有一些 jQuery/JavaScript 代码，我只想在 URL 中存在哈希 (
#example.com/page.html#anchorexample.com/page.html#anotheranchor基本上是这样的：
if (thereIsAHashInTheUrl) {
do this;
} else {
do this;
}
位置哈希的简单使用：
if(window.location.hash) {
// Fragment exists
} else {
// Fragment doesn't exist
}
if(window.location.hash) {
var hash = window.location.hash.substring(1); //Puts hash in variable, and removes the # character
alert (hash);
// hash found
} else {
// No hash found
}
输入以下内容：
<script type="text/javascript">
if (location.href.indexOf("#") != -1) {
// Your code in here accessing the string like this
// location.href.substr(location.href.indexOf("#"))
}
</script>
如果 URI 不是文档的位置，此片段将执行您想要的操作。
var url = 'example.com/page.html#anchor',
hash = url.split('#')[1];
if (hash) {
alert(hash)
} else {
// do something else
}
你尝试过这个吗？
if (url.indexOf('#') !== -1) {
// Url contains a #
}
（显然，其中
url$('#myanchor').click(function(){
window.location.hash = "myanchor"; //set hash
return false; //disables browser anchor jump behavior
});
$(window).bind('hashchange', function () { //detect hash change
var hash = window.location.hash.slice(1); //hash to string (= "myanchor")
//do sth here, hell yeah!
});
这将解决问题；）
window.location.hash
将返回哈希标识符
...或者有一个 jquery 选择器：
$('a[href^="#"]')
您可以使用 现代 JS 来解析 url:
var my_url = new URL('http://www.google.sk/foo?boo=123#baz');
my_url.hash; // outputs "#baz"
my_url.pathname; // outputs "/moo"
my_url.protocol; // "http:"
my_url.search; // outputs "?doo=123"
没有哈希的网址将返回空字符串。
您可以定期检查哈希值的变化，然后调用函数来处理哈希值。
var hash = false;
checkHash();
function checkHash(){
if(window.location.hash != hash) {
hash = window.location.hash;
processHash(hash);
} t=setTimeout("checkHash()",400);
}
function processHash(hash){
alert(hash);
}
var requestedHash = ((window.location.hash.substring(1).split("#",1))+"?").split("?",1);
大多数人都知道 document.location 中的 URL 属性。如果您只对当前页面感兴趣，那就太好了。但问题是能够解析页面上的锚点而不是页面本身。
大多数人似乎忽略的是，这些相同的 URL 属性也可用于锚定元素：
// To process anchors on click
jQuery('a').click(function () {
if (this.hash) {
// Clicked anchor has a hash
} else {
// Clicked anchor does not have a hash
}
});
// To process anchors without waiting for an event
jQuery('a').each(function () {
if (this.hash) {
// Current anchor has a hash
} else {
// Current anchor does not have a hash
}
});
function getHash() {
if (window.location.hash) {
var hash = window.location.hash.substring(1);
if (hash.length === 0) {
return false;
} else {
return hash;
}
} else {
return false;
}
}
Partridge 和 Gareth 的评论非常棒。他们应该得到一个单独的答案。 显然，哈希和搜索属性在任何 html Link 对象上都可用：
<a id="test" href="foo.html?bar#quz">test</a>
<script type="text/javascript">
alert(document.getElementById('test').search); //bar
alert(document.getElementById('test').hash); //quz
</script>
或者
<a href="bar.html?foo" onclick="alert(this.search)">SAY FOO</a>
如果您需要在常规字符串变量上使用它并且碰巧有 jQuery， 这应该有效：
var mylink = "foo.html?bar#quz";
if ($('<a href="'+mylink+'">').get(0).search=='bar')) {
// do stuff
}
（但可能有点过头了..）
将其作为从任意类似 URI 的字符串中抽象位置属性的方法放在这里。尽管
window.location instanceof LocationLocationhashqueryprotocolhrefwindow.location最简单的方法是：
var a = document.createElement('a');
a.href = string;
string.hash;
为了方便起见，我编写了一个小库，利用它来替换本机
Locationwindow.location我注意到所有这些答案主要检查 window.location.hash 并使得编写测试变得困难。
const hasHash = string => string.includes('#')
您还可以像这样从网址中删除哈希值：
const removeHash = string => {
const [url] = string.split('#')
return url
}
最后你可以将逻辑组合在一起：
if(hasHash(url)) {
url = removeHash(url)
}
通常点击先于位置更改， 所以点击后设置TimeOut是个好主意 获取更新的 window.location.hash
$(".nav").click(function(){
setTimeout(function(){
updatedHash = location.hash
},100);
});
或者您可以通过以下方式收听位置：
window.onhashchange = function(evt){
updatedHash = "#" + evt.newURL.split("#")[1]
};
我写了一个 jQuery 插件，它的功能类似于 你想做什么。
这是一个简单的锚路由器。
这是一个返回
truefalsevar urlToCheck = 'http://www.domain.com/#hashtag';
function hasHashtag(url) {
return (url.indexOf("#") != -1) ? true : false;
}
// Condition
if(hasHashtag(urlToCheck)) {
// Do something if has
}
else {
// Do something if doesn't
}
在这种情况下返回
true基于@jon-skeet 的评论。
这是测试当前页面 URL 的简单方法：
function checkHash(){
return (location.hash ? true : false);
}
现代方式，我们现在可以在 2024 年安全地使用 浏览器内置 URL api，它提供了许多用于 URL 解析的工具。
检查 URL 对象：
console.log( new URL(location) )获取 URL 哈希：
new URL(location).hash有时您会得到完整的查询字符串，例如“#anchorlink?firstname=mark”
这是我获取哈希值的脚本：
var hashId = window.location.hash;
hashId = hashId.match(/#[^?&\/]*/g);
returns -> #anchorlink