1

私は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>
4

2 に答える 2

2

朗報です！私はあなたの問題を再現して修正することができました：

デフォルトの宣言ブロックに、以下を追加します。

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

次のようになります。

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

私はそれをテストしました、そしてそれは働きます。残念ながら、なぜこれを行う必要があるのか​​わかりませんが、ここで修正します。

好奇心旺盛な方のために少し更新してください。これが発生する理由は、プラグインソースのこの行です。これは、デバッグが使用されている場合に送信が発生しないようにするための組み込み関数です。

于 2012-07-05T01:13:47.183 に答える
1

問題は、より多くのデバッグを使用して実行しようとしていることです。実例はここに作成されます。 http://codebins.com/codes/home/4ldqpbn/2

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

になる必要があります

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

その理由は、debug = trueバリデーターを使用すると、フォームを送信せずに複数のユースケースを確認できるためです。この機能は、開発者の時間を節約するために作成されているため、開発者が行き来する必要はありません。残念ながら、この機能は保存する代わりに多くの時間を費やしました。

于 2012-07-05T01:45:08.573 に答える