簡單的循環會產生奇怪的結果

Question

當我點擊h2時，我試圖用它的數組索引更新每個按鈕的html。

我試着使用for循環，但它並沒有更新每個按鈕只＃1,3，但2和4保持不變。我究竟做錯了什麼？感謝

演示：http://jsfiddle.net/BVmUL/96/

HTML

<div class='container text-center'> 
    <h2>Click me to toggle the button</h2> 
    <button type='submit' class='btn btn-primary btn-large'>Test</button> 
    <button type='submit' class='btn btn-danger btn-large'>Test</button> 
    <button type='submit' class='btn btn-success btn-large'>Test</button> 
    <button type='submit' class='btn btn-info btn-large'>Test</button> 
</div> 

JS

<script> 
var buttons = [ 
    $("button:eq(0)"), 
    $("button:eq(1)"), 
    $("button:eq(2)"), 
    $("button:eq(3)") 
]; 

$("h2").click(function(){ 
    for(i = 0; i < 3; i++) { 
     buttons[i].text("Array element: " + i++); 
    } 
}); 
</script> 

Answer 1

那是因爲你在遞增循環的中間

buttons[i].text("Array element: " + i++); 

將其更改爲

buttons[i].text("Array element: " + i); 

Answer 2

因爲你有i++內循環。

buttons[i].text("Array element: " + i++); 

使其

buttons[i].text("Array element: " + i); 

Answer 3

var buttons = [ 
    $("button:eq(0)"), 
    $("button:eq(1)"), 
    $("button:eq(2)"), 
    $("button:eq(3)") 
]; 

$("h2").click(function(){ 
    for(i = 0; i < 4; i++) { // here 
     buttons[i].text("Array element: " + (i + 1)); // and here 
    } 
}); 

Answer 4

for(i = 0; i < 3; i++) { 
    buttons[i].text("Array element: " + i++); 
} 

改變它

for(i = 0; i < 4; i++) { 
    buttons[i].text("Array element: " + i); 
} 

需要注意的是，你犯了兩個錯誤，一個是循環只有3元，另一個是遞增我兩次。

Answer 5

for(i = 0; i < 3;) { 
    buttons[i].text("Array element: " + i++); 
} 

如果您想在循環中增加，請刪除for語句中的第三個聲明。否則，你會增加兩次。