5

divを表示/非表示にするラジオボタンがあります。表示されているすべての要素は「必須」ですが、検証ルールの後に無視を追加すると「:hidden」が機能しません...コードは次のとおりです。

<script type="text/javascript">

        $(document).ready(function(){
            $("#myForm").validate({
                rules: {
                    name: "required",
                    age: "required",
                    height: "required",
                    ignore: ":hidden"
                }
            })
        });

    </script>
</head>
<body>
    <form id="myForm" name="myForm" method="post" action="" >
        <input type="radio" name="checkAge" value="adult" onclick="$('#minorRequisites').hide();" />Adult<br/>
        <input type="radio" name="checkAge" value="minor" onclick="$('#minorRequisites').show()" checked="checked"/>Child<br/>
        Name <input id="name" name="name" type="text" /><br/>
        <div id="minorRequisites">
            Age <input id="age" name="age" type="text" /><br/>
            Height <input id="height" name="height" type="text" /><br/>
        </div>
        <input type="submit" />
    </form>
</body>

「大人」にチェックを入れた場合にのみ名前を付けてフォームを送信できるようにしたいのですが…何かアイデアはありますか?:)

4

2 に答える 2

12

ルールで依存関係式を指定requiredして、要素が表示されていない場合に要素を無視させることができます。

$("#myForm").validate({
    rules: {
        name: "required",
        age: {
            required: "#age:visible"
        },
        height: {
            required: "#height:visible"
        }
    }
});

この fiddleで結果を確認できます。

編集: ignoreも機能しますが、それはルールではなくオプションであるため、次のように記述する必要があります。

$("#myForm").validate({
    ignore: ":hidden",
    rules: {
        name: "required",
        age: "required",
        height: "required"
    }
});
于 2011-09-08T15:01:36.703 に答える
0

ignore: ":not(:visible)"の代わりに試してくださいignore: ":hidden"

于 2016-10-05T21:22:45.383 に答える