Internet Exporer javascript click issue

[GreyCanary]

Hello everyone,

I’m working on a simple script which when a user clicks a link it scrolls down the page and opens an accordion. It’s working perfectly on all the browsers I’ve tested until IE. I’m running a test machine on IE 9 and when a user clicks a link which looks like:

javascript:document.getElementById('#ontario').click();setTimeout(function(){ window.scrollBy(0, 400); }, 500);

Instead of scrolling down like on all the other browsers it takes me to a new page which says “39287” there is no source code or other html on the page.

[Paul_Wilkins]

@GreyCanary

Instead of scrolling down like on all the other browsers it takes me to a new page which says “39287” there is no source code or other html on the page.

The number that you’re seeing is a unique number that Internet Explorer uses to identify the setTimeout function. It’s being displayed on the screen due to your “javascript:document…” in the link.

You can prevent such troubles by using proper scripting code instead.

<p><a id="ontario-accordian" href="#">Show me Ontario</a></p>

Then at the end of the body, just before the tag have a <script> section containing this JavaScript code:

function ontarioAccordian() {
    document.getElementById('#ontario').click();
    window.setTimeout(function () {
        window.scrollBy(0, 400);
    }, 500);
}

document.getElementById('ontario-accordian').onclick = function () {
    ontarioAccordian();
    return false;
};

It would also be good to rename the non-standard “#ontario” identifier to be just “ontario”, so that others don’t get confused by your code. The hash symbol can be used inside of href links to refer to an identifer on the page, but # used as an identifier itself is not valid.