困惑全局變量沒有更新

Question

我有以下代碼：

var clickCount = 1; 
var slideCount = $('div.slide').length; 

$('a#next-button').click(function() { 
    if(clickCount < slideCount) { 
     $('div.slide').animate({"left":"-=" + slideWidth}, 'slow'); 
     clickCount = clickCount + 1; 
    } 
}); 

$('p').text(clickCount); 

它有一個全局變量稱爲clickCount。

$('a#next-button').click(function() { …用1的增量更新全局變量，每次點擊<a>元素。

所以，我的問題是，爲什麼：$('p').text(clickCount); 沒有告訴我點擊頁面上更新的clickCount點擊<a>標籤。相反，它只顯示1（原始分配值）。

Answer 1

變量正在更新，但您的函數（$('p').text(clickCount);）僅運行一次，因此僅使用它所看到的值。

要解決此問題，請將$('p').text(clickCount);放入click函數中。

$('a#next-button').click(function() { 
    if(clickCount < slideCount) { 
    $('div.slide').animate({"left":"-=" + slideWidth}, 'slow'); 
    clickCount = clickCount + 1; 
    $('p').text(clickCount); 
    } 
}); 

Answer 2

您需要在每次變量更改時更新段落的文本。該段不會奇蹟般地跟蹤的clickCount變量的值：

$('a#next-button').click(function() { 
    if(clickCount < slideCount) { 
     $('div.slide').animate({"left":"-=" + slideWidth}, 'slow'); 
     clickCount = clickCount + 1; 
     $('p').text(clickCount); 
    } 
});