Question

我使用以下代码为元素的不透明度设置动画：

      var opacity = 0 // starting opacity
      var step = 0.1 // step size
      var target = 1 // target value
      var time = 50 // delay in milliseconds
      // start timer loop, and record it's index
      var increaseOpacity = setInterval(function () {
        // assuming your selector works, set opacity
        $(`#pano-${index}`).attr({ opacity: opacity })
        // increment opacity by step size
        opacity += step
        // if we reached our target value, stop the timer
        if (opacity >= target) {
          clearInterval(increaseOpacity)
        }
      }, time)

      $('.pano').attr({ opacity: 0 })
      increaseOpacity()

有效。但是，每次运行该函数时都会得到Uncaught TypeError: increaseOpacity is not a function。

为什么会这样以及如何解决？

Answer 1

但是，我得到了Uncaught TypeError：increaseOpacity不是一个函数每次我运行该功能。

increaseOpacity不是函数对象，它是计时器的标识符，以便clearInterval可以稍后停止并清除计时器。

为什么会这样以及如何解决？

您可以简单地删除此函数调用，因为它将由setInterval方法自动调用。

Answer 2

var increaseOpacity = function() { // ... if (opacity >= target) { clearInterval(increaseOpacityInterval); } }; var increaseOpacityInterval = setInterval(increaseOpacity);返回间隔索引，而不是函数。

$("#rcapa").html("Capacity of 1 - 16 person"); //insert as a HTML

Answer 3

您正在做的只是将setInterval放入var中这意味着你定义一个var来记住时间执行函数

没有必要调用它，因为它会以代码流的方式执行如果要禁用它，可以在将来使用新的var increaseOpacity来清除这个函数setInterval ......

如果您希望将此步骤作为函数调用，则只需

即可

var increaseOpacity = function(){
    var SomeNewVarForInterval = setInterval(function () {
    // assuming your selector works, set opacity
    $(`#pano-${index}`).attr({ opacity: opacity })
    // increment opacity by step size
    opacity += step
    // if we reached our target value, stop the timer
    if (opacity >= target) {
      clearInterval(SomeNewVarForInterval)
    }
  }, time)
}

如果你想在将来的某个地方清除它，你最好还是记得setInterval为var

为什么我会得到＆＃34; X不是一个功能＆＃34;在以下递归函数中？

3 个答案: