如何獲得這不是同級

這裏一類特殊的prev和next元素是我的代碼：如何獲得這不是同級

<ul> 
    <li class="active"> 
     <div class="course_video_heading"><span class="minus"></span> Introduction <div class="course_duration" align="right">1m 21s</div></div> 
     <ul> 
      <li class="course_video viewed"> 
       Welcome <div class="course_duration" align="right">1m 21s</div> 
      </li> 
      <li class="course_video viewed"> 
       I need to select this <div class="course_duration" align="right">1m 21s</div> 
      </li> 
     </ul> 
    </li> 
    <li> 
     <div class="course_video_heading"><span class="plus"></span> Warm up <div class="course_duration" align="right">1h 15m</div></div> 
     <ul> 
      <li class="course_video viewed current"> 
       Roll down <div class="course_duration" align="right">57s</div> 
      </li> 
      <li class="course_video"> 
       Roll down with demi pointe variation <div class="course_duration" align="right">57s</div> 
      </li> 
      <li class="course_video" data-file="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" data-image="http://content.bitsontherun.com/thumbs/nPripu9l-480.jpg"> 
       Side roll down <div class="course_duration" align="right">57s</div> 
      </li> 
      <li class="course_video"> 
       Side roll down variation with contraction <div class="course_duration" align="right">57s</div> 
      </li> 
      <li class="course_video"> 
       Class exercise <div class="course_duration" align="right">57s</div> 
      </li> 
     </ul> 
    </li> 
    <li> 
     <div class="course_video_heading"><span class="plus"></span> Brushes <div class="course_duration" align="right">1h 5m</div></div> 
     <ul> 
      <li class="course_video"> 
       Welcome <div class="course_duration" align="right">1m 21s</div> 
      </li> 
     </ul> 
    </li> 
</ul>

我的要求：有一個元素，<li class="course_video viewed current">，我需要以前li其中有course_video類。在這種情況下，這將是：

<li class="course_video viewed"> 
    I need to select this <div class="course_duration" align="right">1m 21s</div> 
</li>

什麼有我想：

$(".current").prev(".course_video")

這是行不通的，因爲它是在不同的li

注：這是不是下面的問題重複:)

jQuery to find nearest Div of Parent

Getting next closest select element with jquery

jquery find closest previous sibling with class

來源

2014-09-25 Prasanth Bendra

你可以嘗試得到由類「course_video」的元素，那麼它們之間找到類「當前」的元素，喜歡這裏的http： //jsfiddle.net/0k541m6w/ – Dart 2014-09-25 07:10:41

試試這個：讀current裏的指數，如果是0然後找到其父li以前li然後找到course_video。而如果指數不0，然後使用prev()

var index = $(".current").index(); 
if(index==0) 
{ 
    var previousLi = $(".current").closest('li').prev('li').find("li.course_video:last"); 
} 
else 
{ 
    var previousLi = $(".current").prev(".course_video"); 
}

來源

2014-09-25 06:48:16

這看起來很好，讓我試試這個，但是我期待沒有任何條件的解決方案 – 2014-09-25 06:51:09

$('.current').parents('li').prev().find('li:last')

Here's the jsFiddle

來源

2014-09-25 06:48:27 Ohgodwhy

它就像一個分頁，所以它應該在'li'中工作。 – 2014-09-25 06:50:34

可以與檢查項目的索引功能做很容易找到以前li：如果指數爲0，那麼您將選擇以前的ul中的最後一個li。

Element.prototype.previousLi = function() { 
    var i = $(this).index(), 
     n = this.parentElement.previousSibling.children.length; 

    if (i) return this.parentElement.children[i-1]; 
    else return this.parentElement.previousSibling.children[n-1]; 
}

然後，你可以這樣做：

var el = $(".course_video.viewed.current")[0]; 
var previous = el.previousLi();

來源

2014-09-25 06:55:00

var vindex; 
$().ready(function() { 
    $("li .course_video").each(function (index) { 
     if ($(this).hasClass('current')) { 
      vindex = index; 
     } 
    }); 
    $("li .course_video").each(function (index) { 
     if (index == vindex - 1) { 
      alert($(this)[0].outerHTML); 
     } 
    }); 
});

這個代碼將幫助你。

來源

2014-09-25 07:16:34

試試這個代碼，它會給你想要的結果：

<script> 
    var currentLI = $("li.current"); 

    prevLi=$(currentLI).parent('ul').parent('li').prev('li').find('li.viewed:last'); 

    alert($(prevLi).html()); 
    </script>

來源

2014-09-25 07:30:51

如何獲得這不是同級

回答

相關問題