CODEWITHSUNDEEP
javascriptonclickhidetoggleshow
user1512677
user1512677

Reputation: 33

onclick: Have to click twice in order for a div to hide/show

I have a problem where I have to click twice in order for my JavaScript function to run.

HTML for the button:

<input type="button" id="logintrigger" value="Log In" onClick="hideshow();"/>

JavaScript:

function hideshow() {
    var toggle = document.getElementById('logincontainer');
    toggle.style.display = toggle.style.display == "none" ? "block" : "none";
}

I have been searching around and haven't found anything that helped.

Thank You.

Upvotes: 2

Views: 3498

Answers (2)

Niraj Burde
Niraj Burde

Reputation: 736

Apply style="display:block" explicitly to logincontainer and then change following line : toggle.style.display = toggle.style.display == "block" ? "none" : "block";

Upvotes: 5

Leib Rozenblium
Leib Rozenblium

Reputation: 2419

The initial state of display property is more likely to be empty. That's why till you explicitly change it - this js function gets "".

Upvotes: 2

Related Questions