Question

我有一个javaScript函数。

JavaScript的：

function opacZero(object){
    var presentOpacity = (object.style.opacity);
    object.style.opacity =presentOpacity-0.2;
    setTimeout( function(){opacZero(object)}, 40);
}

现在当我将som eobject传递给这个函数时，它的不透明度应该减少到0并超过0（因为我没有在任何地方清除超时）。但这不会发生。不透明度减少到0.20000000000000007并且不再减少。但是当我减去0.3（或更多）而不是0.2时，它会给出所需的结果。但为什么数字小于0.2。我不知道为什么会这样。帮助PLease

Answer 1

这是由于Javascript如何处理浮点数。查看this SO question以获取有关如何解决此问题的一些建议。

修改

这是一种解决方法：

function opacZero(object){ var presentOpacity = Math.floor(object.style.opacity * 10); object.style.opacity = (presentOpacity - 2) / 10; setTimeout( function(){opacZero(object)}, 40); }

Answer 2

看起来更简单一点，只需检查麻烦的小值并强制它们0。一旦你点击0：

，停止计时器也是一个好主意

function opacZero(object){
    var newOpacity = object.style.opacity - 0.2;
    if (newOpacity < 0.2) {
        newOpacity = 0;
    }
    object.style.opacity = newOpacity;
    if (newOpacity !== 0) {
        setTimeout(function(){opacZero(object)}, 40);
    }
}

工作演示：http://jsfiddle.net/jfriend00/8qkFN/

或者，如果你想要更简洁的东西：

function opacZero(object){
    object.style.opacity = object.style.opacity < 0.4 ? 0 : object.style.opacity - 0.2;
    if (object.style.opacity != 0) {
        setTimeout(function(){opacZero(object)}, 40);
    }
}

Answer 3

这可能是一种解决方法：

function opacZero(object){
    curOpac = curOpac < 0.1 ? 0 : curOpac - 0.2;
    object.style.opacity = curOpac;
    setTimeout( function(){
        opacZero(object)
    }, 400);
    console.log( curOpac );
}

var test = document.getElementById( 'test' ),
    curOpac = 1;
test.style.opacity = 1;
opacZero( test );

http://jsfiddle.net/daCrosby/bhTNC/1/

JavaScript：不透明度应降低到0然后变为负值

3 个答案: