Niconoid Niconoid - 3 years ago 189
Javascript Question

'onclick' event function in document is never being fired

The problem I'm facing is that currently I have 2 elements, one is visible by default and the other one is hidden. When a button is clicked the state in both elements are exchanged, which means that the element which was not visible not it is and viceversa. What I want to accomplish now is that when I click in any other part of the page except in that given element, the state is reversed.

<script type="text/javascript">
function hidesearch() {
var target = event.target || event.srcElement;
if (event.currentTarget == target) {
document.getElementById('elem1').style.display = "none";
document.getElementById('elem2').style.display = "true";
}
}

function showsearch() {
document.getElementById('elem2').style.display = "none";
document.getElementById('elem1').style.display = "true";
event.stopPropagation();
}
</script>


This is the current code inside my
head
tag. Tried to add the
onclick
and
onload
attributes into the
body
too but isn't working still.

<h:body onload="hidesearch();"/>"


The page is .xhtml as everything is being coded using JSF + BootsFaces.

Is there anything I'm missing out?

Answer Source

document.getElementById('elem2').style.display = "true";

display property value of element style can be "block", "inline-block", "inline", "none" but "true" value doesn't exist.

Please assign appropriate value one you want.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download