Changing CSS CSS for just a second?

I have JavaScript that needs to change the display property from none to block. What happens, it blinks on the screen, and then leaves after half a second.

<input type="image" src="images/joinButton.jpg" name="join" value="Join" onclick="check(this.form)" />

function check(form){
        var errorFields = document.getElementById('errorFields');
        errorFields.style.display = 'block';
}
+3
source share
3 answers

This is what probably happens:

  • Image clicked
  • Styles changed
  • Submitted form
  • Page reloaded with original styles

You need to return false from the event handler to cancel the normal operation of the image map if you do not want the form to be submitted.

onclick="return check(this.form)"


function check(form){
    var errorFields = document.getElementById('errorFields');
    errorFields.style.display = 'block';
    return false;
}

You would probably be better off using unobtrusive JS and instead replace the image card's click event with a form event.

+1
source

javascript , , . , html :

<html>
<head>
<script type="text/javascript">
function check(){
    var errorFields = document.getElementById('errorFields');
    errorFields.style.display = 'block';
}
</script>
</head>
<body>
<div id="errorFields" style="border: 1px solid red; height: 300px; width: 300px; display: none;"></div>
<input type="button" name="join" value="Join" onclick="check()" />
</body>
</html>

. , , , check(), , .

+2

, , , , , CSS JavaScript ( JavaScript, ).

, style.display . :

errorFields.style.display = "block";
errorFields.setAttribute("style","display:block");

, Firebug, , CSS , .

+1

All Articles