Question

我有一个高级搜索div，里面有5个表单输入字段。默认情况下，此div是隐藏的，它是搜索表单的一部分。当用户从结果页面返回此页面时，我希望div显示假设填充了5个字段中的任何一个。

html是

 <a class="toggle-link" onclick="ShowDiv('Adv');">+ show advanced fields</a>

  <div id="Adv" class="slide hidden">
    <form>
     <input type="text" name="first_name">
     <input type="text" name="last_name">
     <input type="text" name="street">
     <input type="text" name="town">
     <input type="text" name="country">
    </form>
    </div>

<a onclick="ShowDiv('Basic');">- hide advanced fields</a>

隐藏/显示div的现有jQuery代码是：

function HideDiv() {
         $('.slide').hide();
     }
     function ShowDiv(ctrl) {
         HideDiv();
         $('#' + ctrl).show();
     }
     ShowDiv('Basic');

Answer 1

如果您想在页面加载时检查表单的输入元素，那些包含在div中（具有id'Adv'），那么您应该在文档就绪事件中运行检查

$(function(){
    $("div#Adv input").each(function(){
        if($(this).val()!='')
           $(this).parent().parent().show(); // 1st parent is form, 2nd parent is Adv div 
           return;                       
    });
});

小提琴是here。

只有在加载页面时填充了任何输入（包含数据），这才有效。

在您的问题更新后，我更新了我的小提琴 here。

根据表单输入字段隐藏/显示div

1 个答案: