开发者

removing # fragment identifier from address bar

Hi i hope someone can help. i want to hide the fragment identifier from the address bar so instead of:

www.mydomain.com/example.html#something

i just get:

www.mydomain.com/example.html

when i click on an anchor tag.

I have looked at lots of related questions and forums but still can't quite figure it out. I'm pretty sure i should be using something along the lines of:

window.location.href.replace(/#.*/,''); //and or .hash

put just cannot figure it out.

localScroll plugin allows you to hide or keep the identifiers and by default they are hidden. i think many gallery plugins have a similar option too.

but when i try and do it myself (bit of a novice) i get crazy to no results.

below is some basic example script i would like it to work with:

<style>
.wrap{
width:300px;
height:200px;
margin:auto;
}

.box{
width:300px;
height:200px;
position:absolute;
display:none;
}

#one{background:red;}
#two{background:blue;}
#three{background:green;}

.load{display:block;}
</style>


<body>
<ul>
    <li><a href="#one">One</a></li>
    <li><a href="#two">Two</a></li>
    <li><a href="#three">Three</a></li>
</ul>

<div class="wrap">
    <div id="one" class="box load">This is Box 1</div>
    <div id="two" class="box">This is Box 2</div>
    <div id="three" class="box">This is Box 3</div>
</div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
$(document).ready(function() {开发者_高级运维

$("ul li a").click(function(){

       $("div.box").fadeOut(1000);

       $($(this).attr('href')).fadeIn(1000);

    });
});
</script>
</body>


Add

return false;

at the end of your click function, it will stop this event propagation


the replace function returns a new string, it doesn't operate on the old one. You need to use: window.location.href = window.location.href.replace(/#.*/,'').

However, this will not have the expected effect, as changing window.location.href in any way that's not just adding or changing a hash tag causes a page reload.

The localScroll plugin works by searching for the hashtag and using the jQuery scrollTo plugin to scroll to the location, and preventing the default behavior of the browser when you click on a link with a hash tag. They haven't actually changed the URL to remove the hash, they've prevented it from ever appearing.

The best you can do if you want to remove the hash from the URI is to keep just the # at the end:

window.location.href = window.location.href.replace(/#.*/,'#');

Although in some older browsers, even this will trigger a page reload (only very old browsers, though).


try this....it will remove # globally in your url

window.location.href.replace(/\#*/g, "")

here is DEMO

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜