Question

Actual Error

TypeError：undefined不是函数（评估'ActiveElem [i] .hasClass（'active'）;

HTML

<div class = 'Carousel-Inner'>
  <div class="morningSlide active">
    <img src="/Users/KO527/Sites/TarasDeli/TarasPhotos/EmployeeStoreOpening.jpg">
    <span class = 'time'>At<br>6:00 AM...</br></span>
    <p>Shop Opens up<br>Chefs prepare</br></p>
  </div>
  <div class = 'afternoonSlide'>
      <img src = '/Users/KO527/TarasDeli/TaraPhotos/CrowdedLunchTime.jpg'>
      <span class = 'time'>At <br>11:30 AM...</br>...12:00PM<br>...12:30PM</br>...1:00PM</span>
      <p><br>Students flood Deli</br>For Lunch</p>
  </div>
  <div class = 'ClosingTimes'>
      <img src = '/Users/KO527/TarasDeli/TaraPhotos/TarasNoTraffic.jpg'>
      <span class = 'time'>At <br>4:00 PM...</br></span>
      <p>Deli Closes</p>
  </div>
</div>


jQuery

function ActiveSpan(){
        if ($('.active span').left === '-500px'){
            $('.active span').animate({left: '25px', opacity: 1}, 750);
            }
        setTimeout(function(){$('.active span').stop().animate({left: '-500px', opacity: 0.1}, 1000)}, 5000);
}   

function ActiveP(){
        if ($('.active p').css('left') === '-500px'){
            $('.active p').stop().animate({left: '25px', opacity: 1}, 750);
            }
        setTimeout(function(){$('.active p').stop().animate({left: '-500px', opacity: 0.1}, 750)}, 5000);
}

function PullEmOut(){
    ActiveSpan();
    ActiveP();
}

function CarouselStroll(){
var ActiveElem = $('Carousel-Inner').find('div');
    for (var i = 0; i < ActiveElem.length; i++){
        if (ActiveElem[i].hasClass('active')){
            PullEmOut();
            ActiveElem[i].fadeOut(600).removeClass('active');
        }
        else {
            ActiveElem.filter('.active').removeClass('active');
            ActiveElem[0].addClass('active');
        }

        if (ActiveElem[i+1].length === 0){
            ActiveElem[0].fadeIn(600).addClass('active');
            PullEmOut();
        }
        else {
            ActiveElem[i+1].fadeIn(600).addClass('active');
        }   
    }
}

因此，我们的想法是让CarouselStroll（）函数将'Carousel-Inner'div中的div节点放在ActiveElem变量的内部，而该节变量又假定为一个数组。但是，当代码运行时，浏览器似乎无法解释浏览器所在的行，以查看当前div（i变量）是否具有类'active' - ＆gt;（if（ActiveElem [i] .hasClass（ 'active'））。上面的错误是在Safari控制台中看到的。有人可以帮忙。

P.S - 总的来说，该函数假设循环遍历指定的数组并检查并分配'active'类并渲染PullEmOut函数，它可以正常工作。现在我只关心TypeError。

Answer 1

getElementsByClassName返回一个节点集，它没有＆＃34; children＆＃34;方法

你为什么不使用jQuery

$(".Carousel-Inner").children()

如果你不想使用jQuery，你需要循环遍历集合。

Answer 2

您需要使用jQuery的选择器函数$。 jQuery返回一个特殊的jQuery对象，它提供了您尝试使用的方法children。

$('.Carousel-Inner').children()

在此处详细了解：The jQuery Object

TypeError：undefined不是函数（评估'document.getsElementsByClassName（''）

2 个答案: