jquery - 根据空子表单输入值隐藏给定部分中的 div

Question

我有一个包含 div 结构的表单，如下所示：

<form id="baseform">
    <div class="container">
     <div class="subheader"><h2>Section 1</h2></div>
     <div class="row">
        <textarea id=T_01></textarea>  
        <input id="T_02" type="text" />
     </div>
     <div class="row">
        [more form fields]
     </div>
    </div>
    <div class="container">
     <div class="subheader"><h2>Section 2</h2></div>        
       <div class="row">[more form field, etc.]
     </div>
   </form>

我想隐藏那些在 on 下方具有空表单输入的.rowdiv （我已经在使用在on下方显示div ）。.subheaderdocument readytoggle().row.subheaderclick

似乎这样的事情应该有效：

$(document).ready(function() {
    $('.row :input[@value=""]').parent('.subheader').nextAll('.row').hide();
});

但没有骰子。想法？

Answer 1

$('.row input').filter(function() {
    return this.value.length ? this : null;
}).parent().hide();​

Answer 2

这适用于大多数表单输入，但是，对于复选框和单选框，您可能需要其他条件逻辑，它们有一个值集。需要看看他们是不是:checked。

$('.subheader .row :input').each( function() {
   if ( !$(this).val().length )
      $(this).parent('.row').hide();
});

编辑:input-在我的选择器中 错过了。

编辑 2 - 没有隐藏实际行，只有表单字段。

Answer 3

尝试这个：

$(function () {
    $(".row :input[value='']").hide();
});