Question

我是jQuery的初学者，并尝试构建一个简单的html页面。页面呈现正常并使用jQuery正确验证/行为，但是当一切都有效时，单击“提交”按钮不会提交。我的html文件的完整页面代码如下。为什么表单拒绝提交？

<html>
<head>
<title>jQuery UI Example Page</title>
<link type="text/css" href="css/cupertino/jquery-ui-1.8.21.custom.css"   rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.21.custom.min.js"></script>
<script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>
<script type="text/javascript">
    jQuery.validator.setDefaults({
        debug: true,
        success: "valid"
    }); ;
</script>
<script>
    $.validator.addMethod(
    "regex",
    function (value, element, regexp) {
        var re = new RegExp(regexp);
        return this.optional(element) || re.test(value);
    },
    "Please check your input."
 );
</script>
<script type="text/javascript">
    /**
    * @author GeekTantra
    * @date 24 September 2009
    */
    /*
    * This functions checks where an entered date is valid or not.
    * It also works for leap year feb 29ths.
    * @year: The Year entered in a date
    * @month: The Month entered in a date
    * @day: The Day entered in a date
    */
    function isValidDate(year, month, day) {
        var date = new Date(year, (month - 1), day);
        var DateYear = date.getFullYear();
        var DateMonth = date.getMonth();
        var DateDay = date.getDate();
        if (DateYear == year && DateMonth == (month - 1) && DateDay == day)
            return true;
        else
            return false;
    }
    /*
    * This function checks if there is at-least one element checked in a group of
    * check-boxes or radio buttons.   
    * @id: The ID of the check-box or radio-button group
    */
    function isChecked(id) {
        var ReturnVal = false;
        $("#" + id).find('input[type="radio"]').each(function () {
            if ($(this).is(":checked"))
                ReturnVal = true;
        });
        $("#" + id).find('input[type="checkbox"]').each(function () {
            if ($(this).is(":checked"))
                ReturnVal = true;
        });
        return ReturnVal;
    }
</script>
<script type="text/javascript">
    $.validator.addMethod(
  "totalValidationDate",
   function (value, element) {

       return isValidDate(parseInt(value.split('/')[2]),  parseInt(value.split('/')[0]), parseInt(value.split('/')[1])) || this.optional(element);
   },
  "Please enter a date in the format mm/dd/yyyy"
);
</script>
<script>
    $(document).ready(function () {
        $("#commentForm").validate({
            rules: {
                date1: {
                    required: true,
                    totalValidationDate: true
                },
                textBox1: {
                    regex: "^[a-zA-Z'.\\s]{1,40}$"
                }
            }
        });
    });
</script>
<script type="text/javascript">
    $(document).ready(function () {
        $("#date1").datepicker();
    });
</script>
</head>
<body>
<form id="commentForm" method="get" action="http://www.yahoo.com">
 <input type="text" name="date1" id="date1" />
 <input type="text" name="textBox1" id="textBox1" />
 <input type="submit" value="Submit" id="btnSubmit"/>
</form>
</body>
</html>

Answer 1

好消息！我能够重现你的问题并修复它：

在默认声明块中，添加以下内容：

submitHandler: function(form) {
        form.submit();
}

看起来像：

jQuery.validator.setDefaults({
    debug: true,
    success: "valid",
    submitHandler: function(form) {
        form.submit();
    }
});

我测试了它，它的确有效。不幸的是，我不知道为什么你需要这样做，但这是解决方法。

对那些好奇的人进行轻微更新，发生这种情况的原因是this line in the plugin source。它是一个内置函数，可以防止在使用调试时发生提交。

Answer 2

问题是你试图用更多的调试来运行它。这里创建了工作示例。 http://codebins.com/codes/home/4ldqpbn/2

jQuery.validator.setDefaults({
        debug: true,
        success: "valid"
    });

应该成为

jQuery.validator.setDefaults({
        success: "valid"
    });

原因是当debug = true验证器允许您检查多个用例而不提交表单时创建此功能只是为了节省开发人员的时间，这样他们就不必返回＆amp;向前。不幸的是，这个功能消耗了很多时间而不是保存。

带有jQuery的HTML页面拒绝提交？

2 个答案: