我使用jquery遍历表行并保存数据。如果表有200行,则执行速度很慢。当我调用此方法时,我在IE中收到javascript消息“停止运行此脚本”。以下是我用于循环表行的代码。如果有更好的方法,请告诉我。
function SaveData() {
var $table = $('#' + gridid);
var rows = $table.find('tbody > tr').get();
var transactions = [];
var $row, empno, newTransaction, $rowChildren;
$.each(rows, function(index, row) {
$row = $(row);
$rowChildren = $row.children("td");
if ($rowChildren.find("input[id*=hRV]").val() === '1') {
empno = $rowChildren.find("input[id*=tEmpno]").val();
newTransaction = new Array();
newTransaction[0] = company;
newTransaction[1] = $rowChildren.find("input[id*=tEmpno]").val();
newTransaction[2] = $rowChildren.find("input[id*=tPC]").val();
newTransaction[3] = $rowChildren.find("input[id*=hQty]").val();
newTransaction[4] = $rowChildren.find("input[id*=hPR]").val();
newTransaction[5] = $rowChildren.find("input[id*=tJC]").val();
newTransaction[6] = $rowChildren.find("input[id*=tL1]").val();
newTransaction[7] = $rowChildren.find("input[id*=tL2]").val();
newTransaction[8] = $rowChildren.find("input[id*=tL3]").val();
newTransaction[9] = $rowChildren.find("input[id*=tL4]").val();
newTransaction[10] = $rowChildren.find("input[id*=tL5]").val();
newTransaction[11] = $rowChildren.find("input[id*=tL6]").val();
newTransaction[12] = $rowChildren.find("input[id*=tL7]").val();
newTransaction[13] = $rowChildren.find("input[id*=tL8]").val();
newTransaction[14] = $rowChildren.find("input[id*=tL9]").val();
newTransaction[15] = $rowChildren.find("input[id*=tL10]").val();
newTransaction[16] = $rowChildren.find("input[id*=tSF]").val();
newTransaction[17] = $rowChildren.find("input[id*=tCG]").val();
newTransaction[18] = $rowChildren.find("input[id*=tTF]").val();
newTransaction[19] = $rowChildren.find("input[id*=tWK]").val();
newTransaction[20] = $rowChildren.find("input[id*=tAI]").val();
newTransaction[21] = $rowChildren.find("input[id*=tWC]").val();
newTransaction[22] = $rowChildren.find("input[id*=tPI]").val();
newTransaction[23] = "E";
var record = newTransaction.join(';');
transactions.push(record);
}
});
if (transactions.length > 0) {
var strTransactions = transactions.join('|');
//send data to server
//here ajax function is called to save data.
}
}
表格行的html结构就像这样
<tr class="rgRow" id="ctl00_c_PETV2_1_gB_ctl00__12">
<td>
<a href="javascript:" id="lD" onclick="DeleteRow(this)">Delete</a>
</td><td>
<input type="text" value='385 ' id="tEmpno" />
<input name="ctl00$c$PETV2_1$gB$ctl00$ctl28$hRV" type="hidden" id="ctl00_c_PETV2_1_gB_ctl00_ctl28_hRV" value="1" />
<input name="ctl00$c$PETV2_1$gB$ctl00$ctl28$hRC" type="hidden" id="ctl00_c_PETV2_1_gB_ctl00_ctl28_hRC" value="0" />
</td><td style="width:100px;">
<input type="text" value='Barron, Pamela J.' id="tEE" readonly="readonly" />
</td><td>
<input type="text" value='OT ' id="tPC" />
</td><td>
<input type="text" value='7.00' id="tQty" class="right" />
<input type="hidden" name="ctl00$c$PETV2_1$gB$ctl00$ctl28$hQty" id="ctl00_c_PETV2_1_gB_ctl00_ctl28_hQty" value="7.00000" />
</td><td>
<input type="text" value='22.00' id="tPR" class="right" />
<input type="hidden" name="ctl00$c$PETV2_1$gB$ctl00$ctl28$hPR" id="ctl00_c_PETV2_1_gB_ctl00_ctl28_hPR" value="22.000000" />
</td><td>
<input type="text" value='231.00' id="tAmt" class="right" readonly="readonly" />
</td><td>
<input type="text" value='300 ' id="tJC" />
</td><td>
<input type="text" value='50 ' id="tL1" />
</td><td>
<input type="text" value='23 ' id="tL2" />
</td><td>
<input type="text" value='001 ' id="tL3" />
</td><td>
<input type="text" value=' ' id="tL4" />
</td><td>
<input type="text" value='1 ' id="tSF" />
</td><td>
<input type="text" value='1' id="tCG" />
</td><td>
<input type="text" value='B' id="tTF" />
</td><td>
<input type="text" value='0' id="tWk" />
</td><td>
<input type="text" value='Y' id="tAI" />
</td><td>
<input type="text" value='8810 ' id="tWC" />
</td><td style="width:50px;">
<input type="text" value='' id="tPI" />
</td>
</tr>
答案 0 :(得分:0)
尝试尽量减少使用jQuery find()。它的性能在旧浏览器上非常糟糕。也许使用好的旧getElementsByTagName(),即使在IE6上本机实现。伪代码:
get list of tr elements;
for each tr element:
get list of input elements descending from current tr element;
for each input:
if input.id matches x
if input.id matches y
if input.id matches z
希望这有帮助。
答案 1 :(得分:0)
通过拆分id的那一部分,然后执行find
调用或类似策略来确定输入在事务数组中的位置,将重复调用替换为var index = $.inArray(idFragment, ['', 'tEmpno', 'hQty']);
。
尽可能少地搜索DOM。如果可能,请优先|=
个*=
个选择器。
或者,如果可能的话,根据需要修改jQuery中的serialize
函数,并使用输入的索引来确定它在事务数组中的位置。