Question

// HTML

<div class="sliderImage">
  <img src="icon-facebook.png" name="slidershow" />
</div>

<table>
    <tr>
        <td align="left">
            <a href="" class="sliderPrevious">Previous</a>
        </td>

        <td align="right">
            <a href="" class="sliderNext">Next</a>
        </td>       
    </tr>
</table>

<div id="description">
</div>

// java描述

<script type="text/javascript">
(function(){
    var Image = new Array('icon-facebook.png','icon-google.png','icon-mail.png','icon-twitter.png');
    var Description = new Array('This is an facebook icon','This is an google icon','This is an mail icon','This is an twitter icon');

    var sliderPrevious = document.getElementsByClassName('sliderPrevious')[0];
    var sliderNext = document.getElementsByClassName('sliderNext')[0];
    var sliderAuto = document.getElementsByClassName('sliderAuto')[0];
    var myAutoSlider;

    var Image_Number = 0;
    var Image_Length = Image.length - 1;

    function change_image(num){
          Image_Number = Image_Number + num;

          if(Image_Number > Image_Length){
              Image_Number = 0;
          }

          if(Image_Number < 0){
            Image_Number = Image_Length;

          }

          document.slidershow.src = Image[Image_Number];
          document.getElementById('description').innerHTML = Description[Image_Number];

          return false;
    };

    function autoSlider(){

        myAutoSlider = setInterval(change_image(1), 1000);
    };

    function myEventLisener(target, event, myNumber){
              target.addEventListener(event, function(e){
                         e.preventDefault();
                         change_image(myNumber);

                         clearInterval(myAutoSlider);//if click ,then stop autoplay
              });          
    };
    autoSlider();
    myEventLisener(sliderPrevious,'click', -1);
    myEventLisener(sliderNext,'click', 1);
}());
</script>

上面是我用纯js制作滑块的代码。使用上面的代码，我可以使用下一个和预览按钮，但我无法自动播放，autoSlider功能设置为。

我试过检查员，但没有显示问题。一切都还可以，但是autoSlider（）无法运行，我不知道为什么？帮助？提前做好准备。

Answer 1

setInterval函数必须接收回调，但您正在传递函数调用。所以它只执行一次。

您必须将setInterval实施更改为：

function autoSlider(){
    myAutoSlider = setInterval(function(){change_image(1)}, 1000);
};

工作fiddle

当我使用纯javascript制作滑块时，无法使autoslider（）运行？

1 个答案: