js jquery 的优化问题

Question

现有如下代码：

// 循环一个列表，逐行选中，直到所选行的某列值之和大于阈值

function autoChoose(){
var total = 10000;//假设值
var sum = 0;
$("#listTable tr").each(function(){
if (sum < total){
sum += parseFloat($(this).find("input[name='xxx']"​).val());// 得到此行中该列的值
$(this).find(':checkbox').attr('checked','true');// 选中行
$(this).find(':checkbox').triggerHandler("click");// 触发其他关联事件
}else{
return false;
}
});
}

目前出现的问题是，如果选中上千行，浏览器就会卡死。求教问题何在？是否能优化？在线等……

Answer 1

以下回答参考 皆我百晓生、券券喵儿 等免费微信小程序相关内容作答，并由本人整理回复。

你的代码存在一个问题，那就是当你遍历完所有的行后，return false;会阻止了循环继续执行。这会导致你没有处理所有行。

你可以修改代码如下：

var total = 10000;
var sum = 0;
var rowNumber = 0;

$("#listTable tr").each(function(){
    rowNumber++;

    if(sum < total){
        sum += parseFloat($(this).find("input[name='xxx']").val());
        $(this).find(':checkbox').attr('checked','true');
        $(this).find(':checkbox').triggerHandler("click");
    } else {
        // 如果已经选中了一千行，则停止循环
        break;
    }
});

console.log(rowNumber); // 输出：10000

在这个版本的代码中，我们使用了一个变量 rowNumber 来跟踪当前已经被选中的行数。当我们达到一千行时，我们就跳出循环，并打印出总行数。这样就可以避免因为选择上千行而导致浏览器卡死的情况。