简单的jquery每个循环使浏览器挂起

时间:2011-09-23 16:51:24

标签: javascript jquery

所以我在jquery中调用一个循环遍历表并确定是否根据每行中隐藏的表单元素隐藏行的函数。

当我运行此脚本时,无论是哪种方式切换行,浏览器都会挂起至少5秒,即使行数少于100行。

js看起来像这样:

$('input.vv').each(function(index) {
        var chk = $(this).val();
        if (chk == "0") $(this).parents("tr").slideToggle(function() {
          tableRows();
        });
      });

并且html中的示例行如下所示:

 <tr class="sortable part item" id="row803">
 <td class="col-check">Interior Fixed Dome Camera Surface Mounted<br />(Panasonic Part No. WV-CW484AS/29)
 <input type="hidden" class="vv" value="50" id="v803" /></td>
  <td class="col-equip cen" id="q803">70</td>
      <td class="col-equip cen" id="s803">50</td>
  <td class="col-equip cen"><div id="bom803|092311-001|15"  />50</div></td>
  <td class="col-equip cen" id="b803"><span class="shipped">20</span></td>
</tr>

firebug引用的jquery.js行是8449

return isNaN( parsed = parseFloat( r ) ) ? !r || r === "auto" ? 0 : r : parsed;

我被卡住了(无法链接到现场网站抱歉)。萤火虫可能会让我摆脱困境,但我不确定如何使用它。想什么?谢谢!

2 个答案:

答案 0 :(得分:1)

$('input.vv')创建一个遍历所有输入元素的循环,并检查它们是否属于vv类。

.parents("tr")循环遍历所有父节点,并仅选择<tr>元素。

然后,调用.slideToggle,这会产生需要大量计算能力的效果(以较小的间隔,通过JQuery进行CSS样式调整,通过浏览器进行CSS样式解析)。 可能是主要原因

最后,您正在调用尚未定义的tableRows();

这些操作“少于100行”需要很大的计算能力。

答案 1 :(得分:0)

尝试更具体一点:

$('input.vv').each(function(index) {
    if ($(this).value == "0") $(this).parent().parent().slideToggle(function() {
      tableRows();
    });
  });