javascript location.hash refreshing in IE
I need to modify the hash, remove it after certain processing takes place so that if the user refreshes they do not cause the process to run again.
This works fine in FF, but it seems that IE is reloading every time I try to change the hash. I think it is related to other things that are loading on the page, though I am not certain. I have an iframe that loads (related to the process) as well as some scripts that are still being fetched in the parent window.
I can't seem to figure out a good way to change the hash after all the loading completes. And, at the same time am not even positive that it is related to the loading.
Any ideas on how to solve this?
More odd behavior: The hash is coming from else where in the 开发者_Python百科web app via a redirect. I have found if I simply add the hash by hand, adding #myid to the url, it does not reload. It does not matter if I enter the hash on a page that has already loaded (adding #myid to the already existing url) or by entering the complete url in a new tab.
This appears to be a bug with Internet Explorer (tested with 7 and 8).
Changing window.location.hash should not result in a reload, and it is a common JavaScript technique to use the hash for maintaining state.
If you manually load a page and change the hash using JavaScript it will work.
The problem is when you are redirected to the page from a different location (ie: using HTTP header "Location"), then modifying the hash will result in a reload.
To get around this bug you could:
1) If you can control the redirect, you could replace the Location header with some HTML.
<html>
<head>
<meta http-equiv="refresh" content="0; url=__REDIRECT_LOCATION__">
<script>window.location = "__REDIRECT_LOCATION__";</script>
</head>
</html>
2) if not, you could try reloading the page when it is loaded. To prevent a reload loop you may need to set a cookie.
window.location = window.location; // window.location.reload() didn't work.
In pseudo code:
// if is Internet Explorer
// if ( cookie "reloadPerformed" is not set )
// set cookie "reloadPerformed" = "1"
// reload page
// else
// clear cookie "reloadPerformed"
The obviously drawback is that loading the page results in two page request & render, so you'll would want the reload to be one of the first things the page does when it loads.
@JarneCook seems to be right - it is a bug in IE.
You might be able to just do:
<script type="text/javascript">
window.location.hash = window.location.hash;
</script>
at the top of your page. In normal circumstances, this should be a no-op, but if the user is using IE and has arrived via a redirect, the page will reload before they even notice it has loaded.
The problem is that "The hash is coming from else where in the web app via a redirect.". If you use javascript to redirect the url in the client like this:
location.href = 'test1.aspx#testhash'
it will be ok !
So this is the IE bug: When a web app via a redirect, the browser may only see the prev url, so when you modify the location.hash, the browser sees a url change, so refreshes the page.
The similar issue existed in my project. But we could not use methods described above, because when IE refreshed a page, preloaded data was reset.
So, we used the feature of the browser. When you click for 'a' tag, onClick event happened firstly and after event browser use 'href' attribute for redirecting. When IE use href with hash for redirecting, reloading do not exist. So, you can use onClick event for invoke server-side processing(__doPostBack for asp.net for example) and when the processing will be executed, browser will use 'href' attribute for redirecting. So, new page will not be reloaded.
Also you can use window.location = yourNewLocationWithHash invoking after server-side processing.
I hope this help =)
Was facing this issue, As suggested in one of the answers, the issue was only when a 302/301 redirection. Hash change does not reload if the page was not a redirect. I was redirecting using PHP and did not want to use a cookie to stop the redirection.
More over this issue was there in some IE9 browsers as well, tried 5 IE9 browsers, 4 reloaded the page.
Here is a fix added this in head section :
<!--[if lt IE 10]>
<script type="text/javascript">
if(window.location.hash.replace('#','').length > 0
&& window.location.hash.search('stopredirectioninie') == -1)
{
window.location.href = window.location.href+'&stopredirectioninie';
}
</script>
<![endif]-->
Here is a cross-browser solutions. Works in IE, Chrome, Safari, and FF (tried with latest versions).
var pos = location.href.indexOf('c=');
location = (pos < 0 ?
location + (location.href.indexOf('?') < 0 ? '?' : '&')
: location.href.substring(0, pos))
+ 'c=' + Math.floor(Math.random()*11) + '#' + comment_id ;
Basically, I leverage query ("?") string to trigger the page reload with hash. What the first line does is it checkes whether there is our "golden" query string (I use "c" variable which stands for "comment"). If there is,
- the new URL will have everything before that "c=";
- then adds our golden "c=" + a random number between 0 and 10 + "#" + my comment id to which the browser needs to jump when reloaded.
If there is no,
- the new URL will have everything old URL used to have;
- if the old URL already contains some other query string (something after "?"), add a query append operator "&";
- if no "?", then add it;
- then goes the above mentioned "golden" query.
The reason I add a random number after "?" is that after the first reload there is something like "?#comment-10". In this case, the next change to the URL will not reload the page, since browser understands it as an anchor jump instruction.
To force reload, we need to add some random thing to the query so that the new URL is different from the previous.
This solution will work on all browsers and will make sure the reload doesn't break the existing query. The only note is to make sure your "golden" query variable name is unique.
Hope this helps.
We had the same problem.
In our case it consisted of a http URL which was redirected to https by Apache. Since the string after the hash sign is never passed to the server, it got lost.
If you use javascript to set the hash don't use a "#"
window.location.hash = '#foo'; //IE will reload the page
window.location.hash = 'foo'; //IE will set the hash but will not reload the page
It seems to me that if you change the hash, you are basically changing the location of the page, and so IE (or any browser) would reload. How are you trying to do this? window.location.hash = ""; ?
Maybe Firefox is just smart enough to see what you are doing and avoid the refresh.
加载中,请稍侯......
精彩评论