if else conditions problems

Question

嗨，我在這個函數中有一些問題。

我想創建一個帶有5個div的傳送帶/滑塊，點擊左箭頭時第一個div移動到-336px的左側，但下一個div（框2）的點擊不動。

到左邊，我不知道爲什麼條件沒有驗證。

<div class="test"> 
    <div id="box1" class="box_img" style="background:black"> 
     <img src="images/1.jpg" />  
    </div> 
    <div id="box2" class="box_img" style="background:black"> 
     <img src="images/2.jpg" />  
    </div> 
    <div id="box3" class="box_img" style="background:black"> 
     <img src="images/4.jpg" />  
    </div> 
    <div id="box4" class="box_img" style="background:black"> 
     <img src="images/4c .jpg" />   
    </div> 
    <div id="box5" class="box_img" style="background:black"> 
     <img src="images/5.png" />  
    </div> 
</div> 
<div class="arrow" id="arrow_left"> 
    <img src="images/arrow_right.png" /> 
</div> 
<div class="arrow" id="arrow_right"> 
    <img src="images/arrow_left.png" /> 
</div> 

function Slide(){ 
    $(document).ready(function(){ 
     $("div.box_img").each(function(i){ 
      var firstBox = $("#box1"); 
      var secondBox = $("#box2"); 
      var thirdBox = $("#box3"); 
      var fourthBox = $("#box4"); 
      var fifthBox = $("#box5"); 
     $("#arrow_left").on({ 
      click:function(){ 

       if(i=1){ 
        firstBox.animate({"margin-left":"-336px"},400); 
        //return(i<2); 
       } 
       else if(i=2){ 
        secondBox.animate({"margin-left":"-336px"},400); 
        //return(i<3); 
       } 
       else if(i=3){ 
        thirdBox.animate({"margin-left":"-336px"},400); 
        //return (i<4); 
       } 
       else if(i=4){ 
        fourthBox.animate({"margin-left":"-336px"},400); 
        //return (i<5); 
       } 
       else if(i=5){ 
        fiftheBox.animate({"margin-left":"-336px"},400);  
        //return (i<6); 
       }else{ 
        alert("else finale"); 
       };  
      }//end click fn 
     }) //end on 
     console.log(i); 
     })//end each 
    }) 
}; 

Answer 1

使用==或===比較。您現在正在使用賦值運算符=。