2015-11-05 275 views
0

我似乎无法得到一个前置的跨度来找到它的父亲李...它不应该找到它,不管它们是不是相同的标签吗?jquery .next找不到兄弟

这里的前置,在CSS中它漂浮在列表项的内容的右侧,但是这不应该影响它的权利?

$('aside ul > li').prepend('<span class="icon-arrow-right"></span'); 

和这里的点击功能,似乎不正确产生警报:

$('aside .icon-arrow-right').click(function(){ 
     if($(this).next('ul').hasClass('sub-nav')) { 
      alert('yes'); 
     } else { 
      alert('no'); 
     } 
    }); 

此功能的当前结果总是会弹出一个“不”,不管该列表项具有带有分类导航的子UL。

编辑:这里是HTML,请注意JS增加了跨度,它本身不存在:

<ul> 
<li><span class="icon-arrow-right"></span><a href="#">Accommodations</a> 
    <ul class="sub-nav"> 
     <li><span class="icon-arrow-right"></span><a href="">Inland View Rooms</a></li> 
     <li><span class="icon-arrow-right"></span><a href="">Partial Ocean View Rooms</a></li> 
     <li><span class="icon-arrow-right"></span><a href="">Harbor View Rooms</a></li> 
     <li><span class="icon-arrow-right"></span><a href="">Ocean View Rooms</a></li> 
     <li><span class="icon-arrow-right"></span><a href="">ADA Accessible Guestroom</a></li> 
     <li><span class="icon-arrow-right"></span><a href="">Executive Suites</a></li> 
     <li><span class="icon-arrow-right"></span><a href="">Spa Terrace Suite</a></li> 
     <li><span class="icon-arrow-right"></span><a href="">Cannery Row Suite</a></li> 
     <li><span class="icon-arrow-right"></span><a href="">Grand Bay Suite</a></li> 
     <li><span class="icon-arrow-right"></span><a href="">Presidential Suite</a></li> 
    </ul> 
</li> 
<li><span class="icon-arrow-right"></span><a href="#">Hotel</a></li> 
<li><span class="icon-arrow-right"></span><a href="#">Destination</a></li> 
<li><span class="icon-arrow-right"></span><a href="#">Dining</a></li> 
<li><span class="icon-arrow-right"></span><a href="#">Spa</a></li> 
<li><span class="icon-arrow-right"></span><a href="#">Meetings &amp; Events</a></li> 
<li><span class="icon-arrow-right"></span><a href="#">Weddings</a></li> 
<li><span class="icon-arrow-right"></span><a href="#">Packages</a></li> 
<li class="book-header"><span class="icon-arrow-right"></span><a href="#">Book Now</a></li> 

+0

什么是HTML看起来像你做'prepend'过吗? – Barmar

+2

你可以做一个[Stack Snippet](http://meta.stackoverflow.com/questions/270944/feedback-requested-stack-snippets-2-0)来证明这个问题吗? – Barmar

+0

我已经添加了UL列表的html。 – Xero1

回答

2

.next()方法只返回一个元素的直接下一个兄弟,如果它不匹配提供的选择器,它什么都不返回。

在你的情况下,.next()元素不是<ul>,它是<a>元素。

要找到第一个匹配的兄弟姐妹,使用.nextAll('ul').first()