2

入力された郵便番号が事前定義された配列の郵便番号と一致するかどうかをチェックするフォームを作成しようとしています。私はDBを使用しません.DBはすべて非常に基本的でハードコードされていますが、この場合は十分なはずです.

問題は、配列の最初の郵便番号 (' 83512 ') だけが機能することです。2 番目のもの (' 83533 ') を入力すると、コードは「成功しません」と吐き出します。

私は何を間違っていますか？

前もって感謝します。

HTML:

<form action="javascript:alert('success.');" id="checkplz">
    <label for="plz">ZIP:</label>
    <input type="text" name="plz" id="plz" />
    <button id="submit" >Check!</button>
    <div id="output"></div>
</form>

JQuery:

$(document).ready(function(){
    var list = ['83512','83533'];
    $("#checkplz").submit(function() {
        for (var i = 0; i < list.length; i++) {
            if ($("#plz").val() == list[i]) {
                $("#output").append("<strong class='success'>success!</strong>").show();
                return true;
            }
            $("#output").text("no success!").show().fadeOut(10000);
                return false;
        }
    });
});
4

4 に答える 4

3

ループ内のロジックがオフになっています。下記参照：

$(document).ready(function(){
    var list = ['83512','83533'];
    $("#checkplz").submit(function() {
        var match = false;
        for (var i = 0; i < list.length; i++) {
            if ($("#plz").val() == list[i]) {
                         $("#output").append("<strong class='success'>success!</strong>").show();
                return true;   
            }

        }

        $("#output").text("no success!").show().fadeOut(10000);
                return false;
    });
});
于 2013-02-27T17:18:31.480 に答える
0

問題はループのロジック内にあります。ループは1回だけ実行されます。これは、ループがすべての反復を続行するのではなく、最初の反復の後に常に戻るためです（リスト配列の最初の要素が見つかった場合はtrue、それ以外の場合はfalse）。したがって、2番目の要素で発生しているのは、ループが実行されていることです。最初の要素が見つからなかったと判断し、falseを返し、2番目の要素を処理することさえありません。

これを行うためのより良い方法は、一致する要素が見つかるまでリスト配列をループし、一致が見つかったかどうかを追跡することです。これにより、配列のすべての要素を処理するまで（または一致するものが見つかるまで、ループから脱落しないようになります。一致する場合は、ループを停止して処理を節約できます）。

何が起こっているかについてのいくつかのコメントを含むいくつかのサンプルコードについては、以下（http://jsfiddle.net/ryanbrill/Kws7A/ ）を参照してください。

$(document).ready(function(){
    var list = ['83512','83533'];
    $("#checkplz").submit(function() {
        var matched = false; // Set up variable to track if we find a match
        $(list).each(function() {
            // Inside the jQuery 'each' method, 'this' equals the current item in the iteration.
            if(this == $("#plz").val()) {
                matched = true; // set the 'matched' variable to true
                $("#output").append("<strong class='success'>success!</strong>").show();
                return; // Since we found a match, we can stop processing the array
            }
        });
        // Outside of the loop, only display no success if we didn't find any matches.
        if (!matched) {
            $("#output").text("no success!").show().fadeOut(10000);
        }

    });
});
于 2013-02-27T17:40:49.843 に答える
0

ループの外側で false を返すようにしてください。これは、すべての値がチェックされた後にのみ発生します。

$(document).ready(function(){
    var list = ['83512','83533'];
    $("#checkplz").submit(function() {
        for (var i = 0; i < list.length; i++) {
            if ($("#plz").val() == list[i]) {
                $("#output").append("<strong class='success'>success!</strong>").show();
                return true;
            }
        }
        $("#output").text("no success!").show().fadeOut(10000);
        return false;
    });
});
于 2013-02-27T17:20:25.050 に答える
0

jQuery.inArray() を使用する

var list = ['83512','83533'];
if($.inArray('83533', list) > -1){
    // found
}

ドキュメントはこちら: http://api.jquery.com/jQuery.inArray/

于 2013-02-27T17:21:17.633 に答える