我需要的是,当我想要跳转到下一个dt元素时,在其中一个dt元素上定位.我怎样才能做到这一点？
- <dl class="accordion">
- <dt>Select Category</dt>
- <dd></dd>
- <dt>select product</dt>
- <dd></dd>
- </dl>
- (function($) {
- var allPanels = $('.accordion > dd').hide();
- $('.accordion > dd:first-of-type').show();
- $('.accordion > dt:first-of-type').addClass('accordion-active');
- jQuery('.accordion > dt').on('click',function() {
- $this = $(this);
- $target = $this.next();
- if (!$this.hasClass('accordion-active')) {
- $this.parent().children('dd').slideUp();
- jQuery('.accordion > dt').removeClass('accordion-active');
- $this.addClass('accordion-active');
- $target.addClass('active').slideDown();
- }
- return false;
- });
- })(jQuery);
解决方法
似乎是jquery中显而易见的选项：.next(“dt”)不是,因为.next()总是只返回下一个兄弟,应用过滤器.next(过滤器)仍然只返回下一个兄弟,但是只有它与过滤器匹配
jQuery提供了两种选择：.nextUntil()和.nextAll()
这些可以用作：
- nextdt = thisdt.nextUntil("dt").next();
- nextdt = thisdt.nextAll("dt").first();
其中nextUntil获得下一个兄弟,直到匹配(所以你需要另一个next())和nextAll得到所有的匹配(所以你需要first()).
在问题的代码中,这提供了以下更新：
- jQuery('.accordion > dt').on('click',function() {
- $this = $(this);
- $target = $this.nextAll("dt").first();
