Question

所以我今天早些时候提出了类似的问题，但是我试图对我的代码进行升级。我尝试使用setTimeout函数创建一个滑块，但我一直在我的removeClass is not a function error对象上获得jquery。这是codepen代码

再次感谢。

的index.html

<div class=container>
  <img class='isActive' src="http://placehold.it/350x150">
  <img class='isHidden' src="http://placehold.it/350x150"> 
  <img class='isHidden' src="http://placehold.it/350x150"> 
  <img class='isHidden'src="http://placehold.it/350x150">
</div>

index.scss

html {
  box-sizing: border-box;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

body {
  background: black;
}

.container {
 display: inline;
 //border: 1px solid white;
}

.slide {

}

.isActive {
  visibility: visible;  
}

.isHidden {
 visibility: hidden; 
}

index.js

$(function() {
  var timer;
  var $allImgItems = $('img');
  var $items = $('.container').find($allImgItems);

  for (let i = 0; i < $items.length; i++) {
     var $item = $items[i];
   $item.removeClass('isHidden').addClass('isActive')
                                          /*$item.removeClass('isHidden').addClass('isActive).setTimeout(function() { $( this ).animate( { scrollLeft: 200 + 'px' } ), '500', 'swing', function() { console.log('Animation completed') } }) */
    console.log(`We are at this item: ${$item}`);    
  }
})

Answer 1

查看我如何更改你的js功能。似乎现在工作正常。

＆＃13;

c(1,0,0,0,2,0,0,3,0)

＆＃13;

$(function() {
  var timer;
  var $items = $('img', '.container');

  for (let i = 0; i < $items.length; i++) {
     var item = $items[i];
     $(item).removeClass('isHidden').addClass('isActive');
     console.log(`We are at this item: ${item}`);    
  }
})

＆＃13;

html {
  box-sizing: border-box;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

body {
  background: black;
}

.container {
 display: inline;
 //border: 1px solid white;
}

.slide {
  
}

.isActive {
  visibility: visible;  
}

.isHidden {
 visibility: hidden; 
}

＆＃13;

Answer 2

这里的jQuery选择器

var $items = $('.container').find($allImgItems);

返回一个元素数组，但这些元素本身不是jQuery对象。抓取元素后将其包装在$()中，使其成为jQuery对象。

var $item = $($items[i]);

Answer 3

当你做

时

  var $items = $('.container').find($allImgItems);
  for (let i = 0; i < $items.length; i++) 
  {
     var $item = $items[i];

$ item是一个html节点而不是一个jquery对象，而.removeClass是一个jquery对象函数，所以你需要像这样更改它。

 $($item).removeClass('isHidden').addClass('isActive')

带有setTimeout的滑块 - ＆＃39; removeClass不是函数错误＆＃39;

3 个答案: