检查值是否不等于数组中的位置

Question

我正在尝试删除数据标签与数组当前位置的值不匹配的元素的类。

该数组具有[0,2,4,6,8,10]的值，但是这改变了，所以我不能对其进行硬编码。 如果幻灯片放映时间为4，当前时间为6，则显示“ is-active”类，但在4上删除“ is-active”类。

    if(slideshow[slideshowPosition] == currentTime) {
      $('[data-slideshow-time="' + slideshow[slideshowPosition] + '"]').addClass("is-active");
      $('[data-slideshow-time="' + slideshow.forEach(!slideshow[slideshowPosition]) + '"]').removeClass("is-active");
}

    <div class="slideshow" data-slideshow-audio="audio-default">
<ul class="u-unstyled-list">
    <li data-slideshow-time="0">
        <img src="../img/1-1-slideshow-a.jpg" alt="">
    </li>
    <li data-slideshow-time="2">
        <img src="../img/1-1-slideshow-b.jpg" alt="">
    </li>
    <li data-slideshow-time="4">
        <img src="../img/1-1-slideshow-c.jpg" alt="">
    </li>
    <li data-slideshow-time="6">
        <img src="../img/1-1-slideshow-d.jpg" alt="">
    </li>
    <li data-slideshow-time="8">
        <img src="../img/1-1-slideshow-e.jpg" alt="">
    </li>
</ul>
</div>

Answer 1

如果一次只有一张幻灯片处于活动状态，则可以简单地先从所有幻灯片中删除该类，然后再在所需的幻灯片上设置该类，如下所示：

$('[data-slideshow-time]').removeClass("is-active");
$('[data-slideshow-time="' + slideshow[slideshowPosition] + '"]').addClass("is-active");

但是，您打算使用.forEach()方式不起作用。 .forEach()需要一个用于循环遍历元素的函数。 此外， .forEach()无法以您期望的方式神奇地生成jQuery选择器。

如果出于某种原因，您仍然想要遍历其他对象，则可以通过多种方法进行：

1. 我相信您打算如何使用.forEach() ：

    // comparing slideshow values slideshow.forEach( function( value ) { if( value != slideshow[slideshowPosition] ) { $('[data-slideshow-time="' + value + '"]').removeClass("is-active"); } } ); // or, comparing the slideshow indexes slideshow.forEach( function( value, index ) { if( index != slideshowPosition ) { $('[data-slideshow-time="' + value + '"]').removeClass("is-active"); } } ); 

2. 使用不等于选择器的属性和jQuery的.each() ：

    $( '[data-slideshow-time!="' + slideshow[slideshowPosition] + '"]' ).each( function( item ) { // item is a DOM element $( item ).removeClass( 'is-active' ); } ); 

3. 使用jQuery的.filter()并将其与jQuery的.each()链接起来（效率不高）：

    $( '[data-slideshow-time]' ).filter( function( item ) { // jQuery allows you to get data-* attribute values like this return $( item ).data( 'slideshow-time' ) != slideshow[slideshowPosition]; } ) .each( function( item ) { // item is a DOM element $( item ).removeClass( 'is-active' ); } ); 

等等