Javascript 单击链接可触发多个幻灯片放映

目标是在一个页面上有许多幻灯片，每个幻灯片都是隐藏的，但可以通过单击相关链接激活。加载页面后，第一个页面应显示并开始循环浏览其图像。单击其他链接应激活其相关幻灯片并隐藏原始链接。对于任何后续链接/幻灯片，也应该发生同样的情况-相对于单击的链接，一次只显示一个幻灯片-而所有其他幻灯片都将隐藏，直到单击其相关链接为止

以下是我的大致情况：

这里需要粘贴一大块代码，但stackoverflow似乎坚持要我粘贴一些代码，如果我想包含一个JSFIDLE链接，那么下面是我当前的幻灯片脚本：

// JavaScript Document

$(function(){


var slideshow_class_array = [];
var slideshow_divs;
var temp_id;
slideshow_divs = document.getElementsByClassName('slideshow_container');
$slideshow_obj_array = $.makeArray(slideshow_divs);
$('.slideshow_container').hide();

$.each($slideshow_obj_array, function(){

    $class_holder = this.getAttribute('name');
    slideshow_class_array.push($class_holder);

});

$('.slideshow_link').click(function(){
    for (var i=0; i < slideshow_class_array.length; i++ ) {

        temp_id = this.id.toString();
        temp_class = slideshow_class_array[i].toString();

        if ( temp_id === temp_class ) {

            $('div[name]').hide();
            $('div[name="'+temp_id+'"]').show();
            $('div[name] ul').hide();
            $('div[name="'+temp_id+'"] ul').show();                 
            $('div[name="'+temp_id+'"] .slideshow_fader img:gt(0)').hide();

            setInterval(function(){

              $('div[name="'+temp_id+'"] .slideshow_fader :first-child').fadeOut()
                 .next('div[name="'+temp_id+'"] .slideshow_fader img').fadeIn()
                 .end().appendTo('div[name="'+temp_id+'"] .slideshow_fader');},
              4000);

            } else { 

                $('div[name]').hide();

        }

    }

});

});

//JavaScript文档
$（函数（）{
var slideshow_class_array=[]；
var幻灯片放映分区；
var temp_id；
slideshow_divs=document.getElementsByClassName（'slideshow_container'）；
$slideshow\u obj\u array=$.makeArray（slideshow\u divs）；
$（'.slideshow_container'）.hide（）；
$.each（$slideshow\u obj\u数组，函数（）{
$class_holder=this.getAttribute（'name'）；
幻灯片放映类数组。推送（$class\u holder）；
});
$（'.slideshow_link'）。单击（函数（）{
对于（var i=0；i

---

我非常感谢您的帮助。

没有图像，但看起来仍然可以使用显示在适当位置的图标测试功能……第一和第二个链接工作不正常，而第三个链接工作正常。但是如果我一遍又一遍地点击第三个链接，设置的间隔计时器似乎成指数级增加，幻灯片放映会变成一次糟糕的旅行。不过我可能正在想办法……继续保持他们所说的状态。进展……我的主for循环中缺少了一个break语句。正在更新JSFIDLE。似乎是计时器的问题。随着链接随后被点击，图像淡入淡出过渡之间的时间间隔变得有点扭曲，但在其他方面，它现在似乎工作正常。修复。我的问题是，如上所述，我在循环后丢失了break语句，并且…我没有在每次单击新链接时重置setInterval计时器。没有图像，但看起来仍然可以使用显示在适当位置的图标测试功能…第一和第二个链接工作不正常，而第三个链接工作正常。但是如果我一遍又一遍地点击第三个链接，设置的间隔计时器似乎成指数级增加，幻灯片放映会变成一次糟糕的旅行。不过我可能正在想办法……继续保持他们所说的状态。进展……我的主for循环中缺少了一个break语句。正在更新JSFIDLE。似乎是计时器的问题。随着链接随后被点击，图像淡入淡出过渡之间的时间间隔变得有点扭曲，但在其他方面，它现在似乎工作正常。修复。我的问题是，正如我上面提到的，我在循环后丢失了break语句，并且…我没有在每次单击新链接时重置setInterval计时器。