0

プロジェクトでjquery-stepsプラグインを使用しています.最初はタブが正常に機能していますが、検証スクリプトを作成したときにタブと検証の両方が機能していません.私のプロジェクトでjqueryバリデータープラグインを参照する必要はありますか? .

私が使用したコードは以下のとおりです

<head runat="server">
<link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/themes/base/jquery-ui.css" />  
<link href="css/jquery.steps.css" rel="stylesheet" type="text/css" />
<link href="css/main.css" rel="stylesheet" type="text/css" />
<link href="css/normalize.css" rel="stylesheet" type="text/css" />    
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js"></script>
<script src="scripts/jquery.steps.js" type="text/javascript"></script>
<script src="scripts/jquery.steps.min.js" type="text/javascript"></script>  
<title></title>
</head>
<body>  
<script type="text/javascript">
$(function() {
    $("#form1").steps({
        headerTag: "h2",
        bodyTag: "fieldset",
        transitionEffect: "slideLeft",
        onStepChanging: function(event, currentIndex, newIndex) {
             $("#form1").validate().settings.ignore = ":disabled,:hidden";
             return $("#form1").valid();
        },
        onFinishing: function(event, currentIndex) {
            $("#form1").validate().settings.ignore = ":disabled";
            return $("#form1").valid();
        },
        onFinished: function(event, currentIndex) {
            alert("Submitted!");
        }
    }).validate({
        errorPlacement: function(error, element) {
            element.before(error);
        },
        rules: {
            confirm: {
                equalTo: "#password"
            }
        }
    });            

});
</script>
<form id="form1"  runat="server">          
            <h2>First Step</h2>
            <fieldset>
                  <legend> First Step Info </legend>  
                    <label for="userName">User name *</label>
                    <input id="userName" name="userName" type="text" class="required">
                    <label for="password">Password *</label>
                    <input id="password" name="password" type="text" class="required">
                    <label for="confirm">Confirm Password *</label>
                    <input id="confirm" name="confirm" type="text" class="required">
                    <p>(*) Mandatory</p>

            </fieldset>

            <h2>Second Step</h2>
            <fieldset>
                <legend>Second Step Info</legend>   
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ut nulla nunc. Maecenas arcu sem, hendrerit a tempor quis, 
                    sagittis accumsan tellus. In hac habitasse platea dictumst. Donec a semper dui. Nunc eget quam libero. Nam at felis metus. 
                    Nam tellus dolor, tristique ac tempus nec, iaculis quis nisi.

            </fieldset>                                             
</form>

4

1 に答える 1

2

問題は解決しました。私の推測は正しかったです。jquery バリデータ スクリプトをプロジェクトに参照する必要があり、検証が正しく機能するようになりました。

私の参照サイトはjquery-stepsでした

于 2013-12-12T05:25:22.890 に答える