Jquery在每个索引中查找元素

时间:2018-03-21 00:22:57

标签: jquery

我试图通过嗅探兄弟是否包含无效输入来触发对元素的点击。我试着做以下

  • 获取元素列表
  • 在该列表中,查找兄弟包含元素的案例
  • 根据该
  • 触发点击

完全难倒。我感谢任何帮助。

这是我的非工作代码。



// If page has invalid inputs
if ($('input:invalid').length) {

  // Look through all list items only if it isn't already open
  $('.collapsible > li').children('.collapsible-header:not(.active)').each(function(i, header) {

    // Within each, make sure siblings collapsible body doesn't have bad inputs
    if ($(i).index().siblings('.collapsible-body').has('input:invalid').length) {

      // this does nothing
      $(this).siblings('.collapsible-header').trigger('click');

    }
  });
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="collapsible" data-collapsible="accordion">
  <li>
    <div class="collapsible-header"><i class="material-icons">filter_drama</i>First</div>
    <div class="collapsible-body"><span>Lorem ipsum dolor sit amet.</span></div>
  </li>
  <li>
    <div class="collapsible-header"><i class="material-icons">place</i>Second</div>
    <div class="collapsible-body"><input type="text" class="validate invalid" id="contact" name="contact" value="" required></div>
  </li>
  <li>
    <div class="collapsible-header"><i class="material-icons">whatshot</i>Third</div>
    <div class="collapsible-body"><span>Lorem ipsum dolor sit amet.</span></div>
  </li>
</ul>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:1)

据我所知,你想:

  • 选择所有不活跃的.collapsible-header元素
  • 过滤掉任何包含包含无效输入的同级.collapsible-body元素的文件
  • 触发&#39;点击&#39;在过滤后剩余的任何.collapsible-header元素上。

如果是这样,请尝试以下jQuery:

$('.collapsible > li').children('.collapsible-header:not(.active)').filter(function() {
    return $(this).siblings('.collapsible-body').find('input:invalid').length;
}).trigger('click');