Question

我知道这是一件很简单的事情，但无法理解我做错了什么。我有一个h2标签，它将在点击时运行一个函数，然后它会找到一个带有'homeSlide'类的div，然后运行slideToggle方法。但是，我似乎无法在不使下面的两个div同时滑动的情况下滑动内容。

这是我的HTML：

<h2>Header</h2>

<div id="home_newproducts_list">
   <div class="category-products">
      <ul class="products-grid">
         <li>Hold fetured products so will be excluded from the slideToggle</li>
      </ul>
      <div class="homeSlide">
         <!-- Content that needs to be displayed on slide -->
      </div>
   </div>
</div>

Jquery的：

 jQuery(document).ready(function(){
            jQuery("#home_newproducts_list ul.products-grid").not(":first").wrapAll('<div class="homeSlide">');         
            jQuery(".home-spot h2").click(function(){
               jQuery(this).next('.homeSlide').slideToggle(1000);

            });

          });

我希望我已经足够了解它。

所以我想要做的就是在homeSlide div上运行slideToggle方法，但只在h2之后的下一个方法上运行。

Answer 1

jQuery(".home-spot h2")

假设您在此处选择<h2>Header</h2>元素

尝试使用next()和find()。

  jQuery(this).next().find('.homeSlide').slideToggle(1000);

next()获得紧随其后的兄弟姐妹，在您的案例中为div＃home_newproducts_list

选择嵌套在另一个div下面的div

1 个答案: