谁能告诉我这个switch语句（javascript）有什么问题？

嘿所有，它的典型滑块 - 既可以自动控制，也可以通过用户单击进行控制。问题在于当你点击时，如果你在上一张幻灯片上，它不应该显示右箭头，并且如果你在第一张幻灯片上，它不应该显示左箭头。如果你在其他地方，它应该显示两个箭头。但是，在上一张幻灯片中，它仍然显示右箭头。但是，在第一张幻灯片上时，它不会显示左箭头。但是当你到中间的幻灯片，它不带回右箭头：谁能告诉我这个switch语句（javascript）有什么问题？

$(".paging").show(); 
$(".image_reel img:first").addClass("active"); 
$active = $(".image_reel img:first"); 

var imageWidth = $(".window").width(); 
var imageSum = $(".image_reel img").size(); 
var imageReelWidth = imageWidth * imageSum; 

$(".image_reel").css({'width' : imageReelWidth}); 

rotate = function(){ 

    var triggerId = $active.attr('src').substring(7,8); 
    var image_reelPosition = (triggerId - 1) * imageWidth; 



    $(".image_reel img").removeClass("active"); 
    $active.addClass("active"); 

    switch ($active.attr('src')) { 
     case "images/4.png": 
      var $lastPic = $active.attr("src"); 
      manageControls($lastPic); 
      break; 
     case "images/1.png": 
      var $firstPic = $active.attr('src'); 
      manageControls($firstPic); 
      break; 
     case "image/2.png": 
      var $standardPic = $active.attr('src'); 
      manageControls($standardPic); 
      break; 
     case "image/3.png": 
      var $standardPic = $actice.attr('src'); 
      manageControls($standardPic); 
      break; 
    } 




    $(".image_reel").animate({ 
     left: -image_reelPosition 
    }, 500); 
}; 

rotateSwitch = function(){ 
    play = setInterval(function(){ 
    if(!$(".paging a").show()) $(".paging a").show(); //This is CRITICAL - this makes sure the arrows reappear after they have been removed 
     $active = $(".image_reel img.active").parent().next().find("img"); 
     if ($active.length === 0){ 
      $active = $('.image_reel img:first'); 
      var $firstPic = $active.attr("src"); 
      manageControls($firstPic); 
     } 
     rotate(); 
    }, 5000); 
}; 

rotateSwitch(); 

$(".paging a").click(function(){ 
    $active = ($(this).attr('id')=='rightCtr') ? $(".image_reel img.active").parent().next().find('img') : $(".image_reel img.active").parent().prev().find('img'); 


    if ($active.length === 0){ 
     $active = $('.image_reel img:first'); 
    } 


    clearInterval(play); 
    rotate(); 
    rotateSwitch(); 


    return false; 
}); 


manageControls = function(whichImg){ 
    (whichImg == "images/4.png") ? $(".paging a#rightCtr").hide() : $(".paging a#rightCtr").show(); 
    (whichImg == "images/1.png") ? $(".paging a#leftCtr").hide() : $(".paging a#rightCtr").show(); 

    if(whichImg != "images/1.png" || whichImg != "images/4.png"){ 
     $(".paging a#rightCtr").show(); 
     $(".paging a#rightCtr").show(); 
    } 

};

HTML：

<div class="window"> 
      <div class="image_reel"> 
       <a href="#"><img src="images/1.png" alt="" /></a> 
       <a href="#"><img src="images/2.png" alt="" /></a> 
       <a href="#"><img src="images/3.png" alt="" /></a> 
       <a href="#"><img src="images/4.png" alt="" /></a> 
      </div> 
     </div> 
     <div class="paging"> 
      <a href="#" id="leftCtr">Left</a> 
      <a href="#" id="rightCtr">Right</a> 
     </div> 
</div>

感谢任何回应。

来源

2010-09-06 JohnMerlino

你从错误控制台得到什么输出？另外，在javascript switch语句中，“default”是强制的吗？ – Stephen 2010-09-06 14:30:32

我没有得到任何错误。我所知道的是，当我在上一张幻灯片中时，左箭头不会消失，它应该基于开关状态。在第一张幻灯片上，左箭头确实消失，但在第二张幻灯片上时，左箭头不会返回。 – JohnMerlino 2010-09-06 14:36:57

@Stephen no，默认情况下不是强制性的。 – Pointy 2010-09-06 14:40:37

switch声明很奇怪，但我认为没关系。我认为问题在于“manageControls”功能。在最后的if声明中，您可以做同样的事情两次。 if中的表达式也将始终为为真。

我说，switch是 “怪异”，因为，它是：

switch ($active.attr('src')) { 
    case "images/4.png": 
     var $lastPic = $active.attr("src"); 
     manageControls($lastPic); 
     break;

确定。因此，对于第一个case，您现在知道活动元素的“src”属性是“images/4.png”。所以，如果你知道，为什么你需要再次设置“$ lastPic”变量？为什么你需要这些变量？为什么不折叠整个switch到

manageControls($active.attr('src'));

来源

2010-09-06 14:32:55 Pointy

在manageControls中有一个问题，它应该在第二个三元组中是leftctr而不是rightctr。但是你的推荐实际上也是有效的。例如，使用switch语句，当它不在第一张和最后一张幻灯片上时，它不会返回这两个按钮，但我们的解决方案确实如此。你知道你为什么和那个开关没有吗？奇怪，因为他们似乎在做同样的事情。 – JohnMerlino 2010-09-06 14:45:02

这可能是@aularon发现的问题。 – Pointy 2010-09-06 14:51:13

这是工作，你只是有一个错字：

 var $standardPic = $actice.attr('src'); 
           ^

应该

 var $standardPic = $active.attr('src');

注：

您的代码可以用更优雅的方式重写，您可以使用其他逻辑来代替switch语句，特别是在jquery选择器的帮助下。
使用firebug，它有助于一般的javascript调试和web开发，并且它有一个显示错误的控制台。

来源

2010-09-06 14:45:28 aularon

谁能告诉我这个switch语句（javascript）有什么问题？

回答

相关问题