0

javascript オブジェクト値を使用して簡単なフォーム検証を実行しようとしています。「理想的」ではないことはわかっていますが、鉄壁である必要のないシンプルなフォームで作業しているだけです。

私のフィドルの例を見てください: http://jsfiddle.net/6dXd7/3/

各フォーム フィールドに値があることを確認しようとしています。その場合、 の値を に設定しmyObj.fieldIDますyes

次に、フォームが送信されたら、既存のものをすべてチェックし、myObj.XXXそれらの値がすべて であることを確認しますyes

私の例では、オブジェクトの作成に問題があり、送信ボタンが押されたときにすべてのオブジェクトを名前で指定せずに循環する方法がわかりません。

上記にリンクされている jsfiddle の例のコードは次のとおりです。

<script>
$(document).ready(function () {
    var myObj = {};
    $("input.checkblank").blur(function () {
        var inputID = $(this).attr("id");
        var contents = $("input#" + inputID).val();
        if (contents == "") {
            $(myObj).data(inputID, "no");
        } else {
            $(myObj).data(inputID, "yes");
        }
    });
    $("#verify").click(function () {
        if (myObj.first && myObj.second == "yes") {
            // ***** Trying to get it to scan through ALL existing myObj's and make sure all their values are "yes" *****        
            $('.results').text('all good');
        } else {
            $('.results').text('not good');
        }
    });
});
</script>

<input type="text" name="first" id="first" class="checkblank"><br />
<input type="text" name="second" id="second" class="checkblank">
<a href="#" id="verify">check</a><br />
<p class="results"> </p>

</p>

4

2 に答える 2

1

フィールド情報をjQueryDATAに保存し、後で同じ場所ではなくチェックしようとしていました...

var obj = {}
$(obj).data('a','1');
console.log(obj.a); //this will log null, cause there's no attribute 'a' in 'obj'
console.log($(obj).data('a')); //this will log '1' :]

代わりに、これを行うには、次のようにネイティブオブジェクトの属性にデータを保存する必要があります。

var obj = {}
obj['a'] = '1'; //obj.a = '1' work's too
console.log(obj.a); //now it log '1' :]

また、検証関数が間違っています。first内部myObjに存在するかどうか、およびsecond存在し、に等しいかどうかのみをチェックし"yes"ます。したがって、検証関数は次のようになります。

$("#verify").click(function() {
    var allFieldsOK = false;
    for ( var field in checkedFields ) {
        if ( !(allFieldsOK = checkedFields[field] ) ) break;
    }
    $('.results').text(  allFieldsOK ? 'all good' : 'not good' );
});

これがjsFiddleのアップデートです。これはあなたの目的のために機能しており、クラスでさらに入力フィールドを追加すると機能するはずですcheckblank:] http://jsfiddle.net/6dXd7/5/

于 2012-04-11T17:50:22.350 に答える
0

これを交換

$("#verify").click(.........});

これとともに

$("#verify").click(function() {
    var flag=true;
    $('.checkblank').each(function(){    //check all elements with class checkblank
         if($(this).val().length==0)     //set flag false if anyone of them is blank
            flag=false;                 
    })
    if (flag)  {
            $('.results').text('all good');       
        } else {  
            $('.results').text('not good');
        } 
});

...動作するはずです

于 2012-04-11T17:50:45.267 に答える