为什么在返回false后仍仍提交此表单？

Question

I am planning on showing/hiding divs to validate a form. But the divs only show a split second, and then the form gets submitted...

Any ideas why?

here is the code:

function validateForm() {
var name = nameEmpty(document.getElementById("annonsera_name"));
if (nameEmpty(name)){return false;}
return false;
     }
function nameEmpty(fld){
    if (fld.value==0) {
        document.getElementById("annonsera_nameempty_error").style.display='block'; 
        document.getElementById("annonsera_namenotvalid_error").style.display='none';
        document.getElementById("annonsera_name").focus();
        return false;
    }
    else if (fld.value.match(alphaExp)) {
        document.getElementById("annonsera_namenotvalid_error").style.display='block';  
        document.getElementById("annonsera_name").focus();
        document.getElementById("annonsera_nameempty_error").style.display='none';  
        return false;
    }

         document.getElementById("annonsera_nameempty_error").style.display='none'; 
        document.getElementById("annonsera_namenotvalid_error").style.display='none';
    return false;

            }

and here is the form:

<form name="annonsera" id="annonsera" method="post" enctype="multipart/form-data" onSubmit="return validateForm();">

Answer 1

It's probably generating an error and therefore never returning anything. Assuming you are using Firefox, have you checked the javascript console?

I see what looks like a problem here, where you call nameEmpty() twice - once with a field, and the other time with a (presumably?) boolean value:

var name = nameEmpty(document.getElementById("annonsera_name")); // Returns boolean
if (nameEmpty(name)){return false;} // Tries to pass boolean back into nameEmpty?

Answer 2

Maybe a bit offtopic, but here goes...

You should really consider JQuery Validation , it's nice, clean and easy to implement. I've done it a few times, and never looked back since. It sure beats the manual validation method like the one you use :)

Check out the example , there really is not that much code to write, to get validation going.

In your example that would be (not tested):

<script>
  $(document).ready(function(){
    $("#annonsera").validate({
      rules: {
        annonsera_name: {
          required: true,
          minlength: 1
        }
      },
      messages: {
        annonsera_name: {
          required: "You need to write your name",
          minlength: jQuery.format("At least {0} characters required!")
        }
      }
    })
  });
</script>

There are also a lot of ways of customization through dhtml and css, check out the options .