Answers:
简单:
if(window.location.hash) {
// Fragment exists
} else {
// Fragment doesn't exist
}
.search
可用于<a>
,而不适用于.query
。样品jQuery的:$("<a/>").attr({ "href": "http://www.somewhere.com/a/b/c.html?qs=1#fragmenttest" })[0]
。.hash => "#fragmenttest"
和.search
= ?qs=1
。从那里,提出查询字符串提取问题,以获得字符串以外的其他东西。
hashchange
活动,而不是活动window.location.hash
。尽管IE <8不支持后者
如果URI不在文档的位置,则此片段将执行您想要的操作。
var url = 'example.com/page.html#anchor',
hash = url.split('#')[1];
if (hash) {
alert(hash)
} else {
// do something else
}
obj['0']
。在JS中,这是正确的:arr[0] === arr['0']
因此,如果索引/键不存在,则返回的值是不确定的,而不是超出范围的。jsfiddle.net/web5me/Mw376
$('#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!
});
这将解决问题;)
您可以按照以下步骤定期检查哈希值的变化,然后调用一个函数来处理哈希值。
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);
}
setTimeout(checkHash, 400)
。另外,现代的浏览器都有此hashchange
事件,因此您可以执行window.addEventListener('hashchange', function(){ … })
。最后,hash
即使对于一个示例,泄漏全局变量也是不推荐的做法。
大多数人都知道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和Gareths评论很棒。他们应该得到一个单独的答案。显然,哈希和搜索属性可用于任何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 Location
是正确的,但是任何尝试调用Location
都会告诉您这是一个非法的构造函数。你仍然可以得到喜欢的东西hash
,query
,protocol
通过设置字符串作为等href
一个DOM锚元素,然后将分享所有的地址属性的属性window.location
。
最简单的方法是:
var a = document.createElement('a');
a.href = string;
string.hash;
为了方便起见,我编写了一个小库,利用该库将本机构Location
造函数替换为将接收字符串并产生window.location
类似对象的构造函数:Location.js
通常,点击优先于位置更改,因此单击之后,最好设置setTimeOut以获得更新的window.location.hash
$(".nav").click(function(){
setTimeout(function(){
updatedHash = location.hash
},100);
});
或者您可以使用以下方法收听位置:
window.onhashchange = function(evt){
updatedHash = "#" + evt.newURL.split("#")[1]
};
我编写了一个jQuery插件,该插件的功能类似于您想要执行的操作。
这是一个简单的锚路由器。
这是一个简单的函数,返回true
或false
(具有/没有标签):
var 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的评论。