Question

我正在尝试使用javascript对象值进行一些简单的表单验证。我知道这不是“理想的”，但我只是在使用一种不需要镀铁的简单形式。

我正在尝试确保每个表单字段都有值。如果是，请将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>

Answer 1

您正在将字段信息存储在jQuery DATA中，并尝试稍后检查它们不在同一个地方......

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/

Answer 2

替换此

$("#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');
        } 
});

......它应该有用

如何使用javascript对象验证表单字段？

2 个答案: