Question

我是JS的新手，我试图使用函数稍后用不同的值调用它。但该函数似乎在两个实例中都应用了第一个值。

HTML

<div class="quality">
    <span id="quality" data-avgquality="28"></span>
</div>
<div class="cost">
    <span id="cost" data-avgcost="50"></span>
</div>

JS

$(document).ready(function(){       
    var qualitydata = $("#quality").attr("data-avgquality");
    var costdata = $("#cost").attr("data-avgcost");

    function loadData(id,data) 
    {
        $("#"+id+"").animate({ "width" : qualitydata+"%" }, 1500 );
    };

    loadData("quality",qualitydata);
    loadData("cost",costdata);

});

当我运行它时，两者的数据值都是28％。

Answer 1

更改

function loadData(id,data) 
{
    $("#"+id+"").animate({ "width" : qualitydata+"%" }, 1500 );
};

到

function loadData(id,data) 
{
    $("#"+id+"").animate({ "width" : data +"%" }, 1500 );
};

Answer 2

在loadData函数中，您忽略数据参数，而是使用封闭函数中的qualitydata变量。即你写的地方：

$("#"+id+"").animate({ "width" : qualitydata+"%" }, 1500 );

我认为你打算：

$("#"+id+"").animate({ "width" : data+"%" }, 1500 );

函数不会改变第二次调用它的Jquery / JS

2 个答案: