Javascript onclick needs to be clicked twice for function to run

问题

Javascript onclick needs to be clicked twice for function to run. I need it to run on the first click, That is my problem. I've googled and searched for 2 days now without finding a reply that worked or that I understood.

The code for the javascript can be found here: http://enji.se/windows8/js/script.js

And the site where I want it to work: http://enji.se/windows8/

It's a Windows 8 looking website I'm trying to make. It will only display correctly on Google Chrome and on a resolution higher then 1265x820 and will be awesome on resolutions higher then 1590x920

Thank in advance / enji

SOLVED

回答1:

The problem is inside your click handler boxBegin - the click event is received and passed to your method correctly on the first click, but inside boxBegin you are switching behaviour on the value of box.style.display - in IE9 this is initially "", which triggers your close code rather than the open code you want.

Change boxBegin to:

function boxBegin() {
    var box = document.getElementById('boxBegin');
    if (!box.style.display || box.style.display == "none") {
        box.style.display = "block";
    }
    else {
        box.style.display = "none";
    }
}

回答2:

I googled this when I came upon the same problem.

I was checking for if window.location.hash was a certain value, then styling my menu tabs accordingly.

For me, the solution was as simple as running a 10 millisecond delay function, that then ran my main functions.

The problem for me came from a script that checked for a change at the exact same time as the change was made, not before, not after, but at the same time. This made me have to double click for it to change again, and for the function to notice the change a second time around.

Remember, it's always easier to run even a 5 millisecond delay script when things don't seem to register changes. This has helped me time and time again