Window.location Not Working Correctly In Ie7/8

I have a div which has an a inside it. I want to click on the div and follow the same url as the a. This is the HTML:

Solution 1:

I am posting this as a different answer because it is a different answer. How to work through problem with JavaScript instead of work through it with HTML and CSS.

Try changing your JavaScript to display and make sure the values are what you think they are

$(this).click(function() {
    var href = $(this).children('a').first().attr('href');
    alert(href)
    alert(href.length)
    window.location = href;
});

That will display the href and the href length. Make sure the length matches up. If the length is too big then that means there are hidden characters.

If you determine that the problem is due to syntax, many URL fixes/conversions can be done with JavaScript. For example, removing a trailing slash when there is one can be done with

$(this).click(function() {
    var href = $(this).children('a').first().attr('href');
    window.location = href.replace(/\/$/, '');
});

Also, the URL could be converted to an absolute URL using JavaScript if that is what will fix the problem. And any other troublesome or even invisible characters can be either removed or replaced.

Can you post a web page on the internet that we can access to see the issue on our own copies of IE? Can you post an HTML file that we can copy to our machine and view in a browser? Your comment on the other question tells me you have some sort of XHTML strict DOCTYPE. If one of us can make the issue happen on our end, it is more likely to be fixed.

Solution 2:

As I mentioned in my comment, I'm not 100% sure about it (how IE7+8 handle the .location object), but after all it's just an object.

Try to explicitly set the href property within the location object:

window.location.href = href;

Solution 3:

Although the topic is old, it's not obsolete. I just had the same problem.

window.location = href;

works fine, if you put another command after that.

window.location = href;
returnfalse;

This works for me and redirects with the correct URL. Hope this helps others with the same problem.

Solution 4:

Not exactly a direct answer to you question but I have two suggestions

1. You may just want to try to see if jQuery will handle it for you

   $(this).children('a').first().click()
   

   Edit: This did not solve the problem

2. Also you may just want to make the whole <div in to an <a tag with style="display: block; text-decoration: none". You can use font colors and underlines to make the text inside look however you want. Also, this solution does not require JavaScript. and it also makes the whole div show as focused instead of just the a or nothing at all.

Share