Question

我想使用jquery隐藏所有字段为空的行。

HTML：

<div class="container">

    <div id="row_3">
        <input type="text" id="field_3" name="field[]" value="PHP"/>
    </div>  

    <div id="row_5">
        <input type="text" id="field_5" name="field[]" value="Javascript"/>
    </div>  


    <div id="row_8">
        <input type="text" id="field_8" name="field[]" value=""/>
    </div>  


    <div id="row_10">
        <input type="text" id="field_10" name="field[]" value="C++"/>
    </div>  


    <div id="row_12">
        <input type="text" id="field_12" name="field[]" value=""/>
    </div>      

</div>

<a href="javascript:void(0);" class="save">SAVE</a>

JS：

$(".save").click(function ()
    {
        var fieldArr = $( "input[name='field[]']" );

        for(i=1; i<=fieldArr.length;i++)
        {

            if(fieldArr[i]=='')
            {
                fieldArr[i].hide();    
            }

        }



    });

Answer 1

写：

$(".save").click(function (){
    $("input[name='field[]']").each(function(){
        if($(this).val() == ""){
            $(this).hide();
        }
    });
});

Updated fiddle here.

Answer 2

$(".save").click(function (){
    $('.container :input').each(function() {
        if ($(this).val().length == 0) {
            $(this).hide();
        }
    });                    
});

的 The demo. 的

Answer 3

您正在将DOM Element对象与空字符串进行比较，这是不正确的，当然，您应该阅读.value属性。你也在DOM元素对象上调用jQuery .hide()方法，你应该使用jQuery .eq(i)方法返回一个jQuery包装元素或操作style属性。

for (var i = 0; i < fieldArr.length; i++) {
    if (fieldArr[i].value == '') {
        fieldArr[i].parentNode.style.display = 'none';
    }
}

由于您使用的是jQuery，您还可以使用.filter()方法，该方法的作用类似于循环，但只返回满足条件的元素，在本例中为长度为0的值：

$('.container > div').filter(function() {
    return !$("input[name='field[]']", this).val().length; 
}).hide();

http://jsfiddle.net/GLeZc/

Answer 4

这会奏效。已经在小提琴上进行了测试。

$(".save").click(function(){
    $( "input[name='field[]" ).each(function(){ 
        if($(this).val() == ''){
            $(this).hide();
        }
    });              
});

隐藏html数组jquery中的空字段行

4 个答案: