1

我正在做一个温度计，我正在制作温度计的动画。我有这样做的javascript方法：

function setScoreBar(score) {
    var scoreBar = document.getElementById("dynamicScoreBar");
    // var scoreBar = $(scoreBarElem);
    var height = 250;
    height = height - 20;
    var percentage = height / 100;
    scoreBar.find(".meter").animate({
         marginTop: (height - (score * percentage)) + "px"
    }, 400, function() {
        scoreBar.find(".meter").html(score + "%");
    });
}

我的html看起来像这样

<div id="dynamicScoreBar" class="scoreBar">
    <div class="meter">0%</div>
    <div class="red"></div>
</div>

当我调试它时，我收到错误消息，指出 .find 和 .animate 方法不存在。但是当我尝试编写它时，我得到了视觉工作室的帮助，它向我展示了使用它的选项，因此它应该存在：P 我可以使用其他东西吗？还是我有任何语法错误？

4

1 回答 1

5

.find并且.animate是 jQuery 函数。它们在scoreBarjQuery 对象时存在。当您将其分配给 时，它不是document.getElementById。getElementById是一个纯 javascript 函数，将返回一个 DOM 节点。

如果您使用的是 jQuery 框架，您可以将任何 DOM 节点转换为 jQuery 对象，方法是使用$(...). 对于您的特定场景，您可以完全重写变量赋值：

var scoreBar = $('#dynamicScoreBar');

...并且该scoreBar变量将是一个 jQuery 对象，其中find和animate函数可用。

于 2013-07-25T07:37:18.207 回答