javascript - 在没有用户事件的情况下对多个 div 执行 Jquery 函数

Question

我有一个名为“widthz”的变量，用于确定 .progress 的 css 宽度

“widthz”的每个实例都是唯一的，因为它是根据其他“兄弟”div 到 .progress 的内容确定的。现在，我的功能可以完美运行，但前提是您单击 .item。我希望在没有用户事件(例如点击)的情况下对 .progress 的每个实例都执行此操作。

当前代码:

$(document).ready(function() {


 $( ".budgets .item" ).click(function() {

        var limitz = $(this).children('.limit').html();
        var spentz = $(this).children('.spent').html();
        var widthz = spentz / limitz * 100 ;

        $(this).find('.progress').css('width', widthz + '%');

});




});

Answer 1

将事件处理程序替换为 each 以遍历所有事件并保留 this 引用

$(document).ready(function() {
    $( ".budgets .item" ).each(function() {
        var limitz = $(this).children('.limit').html();
        var spentz = $(this).children('.spent').html();
        var widthz = spentz / limitz * 100 ;

        $(this).find('.progress').css('width', widthz + '%');
    });
});