Question

I have some JavaScript that is supposed to change the display property from none to block. What happens is it flashes on the screen then goes away in 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';
}

Answer 1

This is what is probably happening:

1. Image clicked
2. Styles changed
3. Form submitted
4. 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 don’t want the form to submit.

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 replacing the image map’s click event with the form’s submit event though.