Question

我使用javascript来动画一些符合div的文本。

textValue可以是14-92之间的任何数字。然后，我需要将此数字更改为百分比（介于1和100之间），并将此值从0开始设置为百分比。问题是它显示了NaN并且我不确定是什么导致了这一点。

我相信行中的问题whileValue = ...

我已在我的代码中更早地声明了变量。

知道是什么导致了这个问题吗？

由于

        $("#percent")
            .delay(3000)
            .animate({
                bottom: textValue 
            }, {
            step: function () {
                whileValue = (Math.ceil(parseInt($(".progressbar-cover").css("bottom")-14)/78)*100);
                $("#percent").html(whileValue); //Increase the number to whileValue inline with animating upwards
            }
        });

编辑：为@mike

添加了我的html

  <div class="progressbar">
      <div style="position:absolute; left:-14px; bottom:0%;" id="percent">0%</div>
      <span class="progressbar-value"><em class="progressbar-cover"></em></span>
  </div>

Answer 1

你在做什么

parseInt($(".progressbar-cover").css("bottom")-14)

您可以通过以下方式更正：

parseInt($(".progressbar-cover").css("bottom"))-14

您将能够解析“12px”，但不能解析“12px” - 14

Answer 2

css("bottom")会返回一个数字吗？或者它返回如下内容： 24像素？

只需添加：

.css("top").replace("px","");

Answer 3

我同意Alytrem，但因为它是一个百分比值，

我会选择以下（parseFloat）：

var value = ((parseFloat($(".progressbar-cover").css(bottom))-14)/78)*100);;
 $("#percent").html(value);

我的javascript / jquery代码的JavaScript NaN问题

3 个答案: