4

我正在尝试编写一个函数，该函数将通过随着时间的推移调整元素的“左”样式来移动元素。它目前根本无法以目前的形式工作。

    变量选项卡；
    变量选项卡；

    函数初始化（）{
        tab = document.getElementById("tab");
        tabPos = 10.8;
        tab.style.left = tabPos + '%';
    }

    函数 moveOver( ) {
        如果 (tabPos < 15.8)
            {
                setTimeout(函数 moveOver(), 100;
                选项卡位置 = 选项卡位置 + 0.1；
                tab.style.left = tabPos + '%';
            }
        否则如果 (tabPos > 15.8)
            {
                setTimeout(函数 moveOver(), 100;
                tabPos = tabPos - 0.1;
                tab.style.left = tabPos + '%';
            }
     }

init 函数成功设置了元素的初始位置，但我将 moveOver 函数添加到不再设置元素位置的代码中。

4

3 回答 3

1

函数调用的括号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-29T06:41:59.640 回答
1

更改setTimeout(function moveOver( ), 100;为setTimeout(moveOver, 100);

于 2012-11-29T06:42:33.513 回答
1

更改行：

setTimeout(function moveOver( ), 100;

至

setTimeout(moveOver, 100);

function moveOver( )不是有效的 JavaScript 语法。此外，您的括号（或括号）不匹配。因为您有语法错误，所以您的代码将无法工作。

对于setTimeout，您应该将函数作为第一个参数传递，因此mouseOverorfunction(){mouseOver();}将起作用。

你的脚本的另一个问题......是你会看到元素不断地跳跃。

你有两个条件：tabpos < 15.8和tabpos > 15.8。执行不进入两个 if 块中的任何一个的条件是tabpos == 15.8... 但 JavaScriptNumber实际上是一个浮点数。由于精度误差，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-29T06:43:44.560 回答