Question

我可能是错误的做法，所以我需要你的帮助。我在这里设置了一个jsfiddle：https://jsfiddle.net/m35o8jjL/2/

HTML：

$( ".layered_subtitle_heading" ).click(function() {
  $(this).prev().find('.layered_close').toggleClass('closed');
  $(this).prev().find('.layered_filter_ul').toggle();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="layered_filter">
  <div class="layered_subtitle_heading clearfix">
    <span class="layered_subtitle">Metall</span> 
    <span class="layered_close"> <a href="javascript:;" data-rel="ul_layered_id_feature_9"></a> </span>
  </div>
  <ul id="ul_layered_id_feature_9" class="layered_filter_ul ">
    <li class="nomargin hiddable filter_lg">
      <div class="checker" id="uniform-layered_id_feature_38">
        <span>
          <input type="checkbox">
        </span>
      </div>
      <label for="layered_id_feature_38">
        <a href="#">925  Sterling Silber</a> 
      </label>
    </li>
  </ul>
</div>

基本上，我想要的是当用户点击layered_subtitle_heading div，layered_close span的类切换时，与ul的显示相同。

我可能没有正确使用prev()，但我真的想不出任何方法让这项工作。

我有多个layered_filters，这就是为什么我必须使用$(this)。

Answer 1

.prev()方法用于导航到之前的兄弟。你的目标<div>没有以前的兄弟姐妹;它是其父母的第一个孩子。

您可能想要做的是

$(this).parent().find('.layered_close').toggleClass('closed');

或者，对变化更具弹性：

$(this).closest(".layered_filter").find('.layered_close').toggleClass('closed');

Answer 2

修复它删除.prev（）并添加.siblings（）以获取ul来切换

 $( ".layered_subtitle_heading" ).click(function() {
     $(this).find('.layered_close').toggleClass('closed');
     $(this).siblings('.layered_filter_ul').toggle();
     // you need to use alert()
     alert('da');
 });

并且您没有将jQuery添加到您的小提琴中 - https://jsfiddle.net/Jim_Miraidev/m35o8jjL/13/

Answer 3

试试这个

  $(document).ready(function(){
      $( ".layered_subtitle_heading" ).click(function() {
          $(this).parent().toggleClass('closed');
      });
  });

jQuery find（）不使用prev（）

3 个答案: