Question

我有一个表单，我在onsubmit上执行javascript验证功能：

       <form method="post" onsubmit="return validateForm(this.id)" action="<?php echo $PHP_SELF; ?>" enctype="multipart/form-data" id='addjournalinfoform' style='border:0px;width:90%' class="formular" >

            <fieldset>
                <legend>
                Journal
                </legend>
                <label>
                    <span>* ISSN:</span><br />
                    <input type='text' onfocusout="validateField('issn')" class='text-input' value="" name="issn" id="issn" style='width:30%'>
                </label>
           </fieldset>

       </form>

这是功能：

function validateForm(form)
{
    if(form=="addjournalinfoform")
    {
        alert('onSubmit');
        if($('#issn').val()=="")
        {
            $('#issnMsg').hide(500);
            $('#issnMsg .formErrorContent').html("* This field is required!<br />");
            $('#issnMsg').css('margin-left', $('#'+field).width()-20);
            $('#issnMsg').show(500);
            $('#issn').focus();
            $('html:not(:animated),body:not(:animated)').animate({scrollTop: $('#issn').offset().top-50}, 0);
            return false;
        }
        else
        {
            return true;
        }

    }
    return false;
}

问题是即使函数返回false，表单仍然被提交。怎么了？以及如何阻止提交？

Answer 1

在这一行：

$('#issnMsg').css('margin-left', $('#'+field).width()-20);

未定义变量field。

未捕获的ReferenceError：字段未定义

您必须学习如何调试自己的应用程序，因为如果没有它，您将无法实现。阅读有关在您使用的任何浏览器中使用控制台的信息。

您可以在this Webmasters.SE question中找到有关在浏览器中打开控制台的信息。

Answer 2

打开控制台（firebug，chrome，opera，ie9都有）。执行validateForm（）时检查是否没有错误。

我猜行中有错误：

 $('#issnMsg').css('margin-left', $('#'+field).width()-20);

有一个错误：

 Uncaught ReferenceError: field is not defined

您是否声明了field变量？

Javascript验证表单不会阻止提交

2 个答案: