15

私は現在のバージョンの jQuery (1.8.3) と最新バージョンの jQuery validate (1.10.0) を使用しています。Internet Explorer 8 では、jquery validate は検証中のフォームのすべての入力を検証しているようです。ルールが定義されているものだけです。他のブラウザー (IE9+、FF、Chrome) でも問題なく動作し、jQuery validate 1.9.0 を使用すると問題なく動作します。

この問題を示す例を次に示します。

<!DOCTYPE html>

<html>
<head>
    <title>IE8 + jQuery Validate 1.10 Test</title>
    <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js'></script>
    <script type='text/javascript' src='http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.min.js'></script>
</head>
<body>
    <div>
        <form id="my-form">
            <label for="my-required-field">required:</label>
            <input id="my-required-field" type="text" name="reqField" />
            <label for="my-optional-field">optional:</label>
            <input id="my-optional-field" type="text" name="optField" />
            <input id="wh-submit-button" type="submit" value="submit" />
        </form>
    </div>
    <script type="text/javascript">
        $(document).ready(function () {

            var form = $("#my-form");
            var validator = form.validate({
                rules: {
                    "reqField": { required: true }
                },
                messages: {
                    "reqField": { required: "this field is <i>actually</i> required" }
                }
            });

            $("#wh-submit-button").click(function () {
                if (validator.form()) {
                    alert('passed validation');
                }
            });
        });
    </script>
</body>
</html>

IE8 では、「検証に合格しました」アラートは発生せず、オプション フィールドは必須としてマークされます。

オプションのフィールドを必須でないと明示的にマークすると、正しく機能します。

rules: {
    "reqField": { required: true },
    "optField": { required: false }
}

ただし、明示的に必須ではないすべての入力要素をオプションとしてマークする必要があることは確かに最適ではありません。これは、私の知る限り、以前の要件ではありませんでした。

jquery と jquery validate の以前のバージョンに問題があったことは知っていますが、表面上は jQuery validate 1.8.1 で解決されました。最新バージョンの jquery と validate プラグインに問題があるように思われるため、この問題を提起します。

アップデート：

したがって、この問題は、Internet Explorer F12 開発者ツールを使用して IE8 の動作をエミュレートする場合にのみ現れるようです。私が提供した IE8 のサンプルには実際には問題がなかったというコメントに基づいて、完全な Windows VM を構築し、完全な Internet Explorer 8 をインストールしましたが、実際には問題はありませんでした。エミュレーターと本物には明らかに違いがありますが、これまで JavaScript エミュレーションでそのような問題を見たことがなく、jQuery Validation 1.10 で突然発生し始めたという事実に衝撃を受けました。

これはエミュレーションの問題であり、本物の問題ではないため、ここで解決することは何もありません。そもそもエミュレータ経由であったことを明らかにすべきでしたが...おそらく他の誰かが同じトラップに陥る可能性があり、これは有用なリファレンスになるでしょう.

4

1 に答える 1

0

代わりにこれを試してください...

組み込みの jQuery 1.8.2 を使用した jsFiddle DEMO

jQuery 1.8.3 を使用した jsFiddle DEMO

$(document).ready(function() {

    var form = $("#my-form");
    var validator = form.validate({
        rules: {
            "reqField": {
                required: true
            }
        },
        messages: {
            "reqField": {
                required: "this field is <i>actually</i> required"
            }
        },
        submitHandler: function(form) {
            alert('passed validation');
            // form.submit();
        }
    });

});​
于 2012-12-17T23:39:12.177 に答える