使用Javascript功能的問題

我正在嘗試編寫一個函數，通過隨時間調整「左」樣式來移動元素。目前，它目前沒有任何工作。使用Javascript功能的問題

 var tab; 
    var tabPos; 

    function init() { 
     tab = document.getElementById("tab"); 
     tabPos = 10.8; 
     tab.style.left = tabPos + '%'; 
    } 

    function moveOver() { 
     if (tabPos < 15.8) 
      { 
       setTimeout(function moveOver(), 100; 
       tabPos = tabPos + 0.1; 
       tab.style.left = tabPos + '%'; 
      } 
     else if (tabPos > 15.8) 
      { 
       setTimeout(function moveOver(), 100; 
       tabPos = tabPos - 0.1; 
       tab.style.left = tabPos + '%'; 
      } 
    }

init函數成功地設置元素的初始位置，但我加入moveOver功能的元素的位置不再設置的代碼。

來源

2012-11-29 bearsquared

你有一個語法錯誤。應該是'setTimeout（moveOver，100）;' –

更改線路：

setTimeout(function moveOver(), 100;

到

setTimeout(moveOver, 100);

function moveOver()不是有效的JavaScript語法。另外，括號（或括號）不匹配。因爲你有一個語法錯誤，你的代碼將無法工作。

對於setTimeout，你應該傳遞一個函數作爲第一個參數，所以mouseOver或function(){mouseOver();}將工作。

你的腳本的另一個問題是你會看到不斷跳躍的元素。

您有兩個條件：tabpos < 15.8和tabpos > 15.8。執行不進入兩個if塊之一的條件是tabpos == 15.8 ...但是JavaScript的Number實際上是一個浮點數。由於精度錯誤，15.8 == 15.7 + 0.1將導致false，這表明15.8不完全相同15.7 + 0.1。事實上，15.7 + 0.1是大約等於15.799999999999999 ...

所以我建議你使用一個整數值爲tabPos，例如158，並設置樣式只有當10分攤。

你的代碼的一種可能的結果是：

var tab; 
var tabPos; 

function init() { 
    tab = document.getElementById("tab"); 
    tabPos = 108; 
    tab.style.left = tabPos/10 + '%'; 
} 

function moveOver() { 
    if (tabPos < 158) 
     { 
      setTimeout(moveOver, 100); 
      tabPos = tabPos + 1; 
      tab.style.left = tabPos/10 + '%'; 
     } 
    else if (tabPos > 158) 
     { 
      setTimeout(moveOver, 100); 
      tabPos = tabPos - 1; 
      tab.style.left = tabPos/10 + '%'; 
     } 
}

來源

2012-11-29 06:43:44

是的，語法是主要問題，代碼工作，但現在，當它達到15.8％，而不是停止時，該元素似乎口吃。 – bearsquared

這是因爲您正在使用'<' and '>'而不是'<=' or '> =' – Sphvn

我試過< =和> =並且仍然發生。 – bearsquared

您setTimeout函數調用括號內是沒有關閉：

function moveOver() { 
    if (tabPos < 15.8) 
     { 
      setTimeout(function moveOver(), 100; 
      tabPos = tabPos + 0.1; 
      tab.style.left = tabPos + '%'); // <---- 
     } 
    else if (tabPos > 15.8) 
     { 
      setTimeout(function moveOver(), 100; 
      tabPos = tabPos - 0.1; 
      tab.style.left = tabPos + '%'); // <---- 
     } 

}

您應該看到你的瀏覽器所報告JavaScript錯誤。

來源

2012-11-29 06:41:59 ColinE

這些不是放置此代碼右括號的正確位置。 –

變化setTimeout(function moveOver(), 100;到setTimeout(moveOver, 100);

來源

2012-11-29 06:42:33

使用Javascript功能的問題

回答

相關問題