刪除數組中的項時重新分配類名

Question

我有一個用戶可以輸入的數據表：

<tbody>
    <tr class="wiring_details_6-73" id="wiring_rows_0">
        <td colspan="2"> Wire Type:
            <select class="wire_selector_0" id="wiring_select_0" name="select_wire_6" onchange="Estimate.select_wire( 6, this.value, 0 );">
                <option value="" selected="selected">Select wire..</option>
                <option value="1">14/2</option>
                <option value="2">14/4</option>
                <option value="3">16/4</option>
                <option value="4">16/2</option>
                <option value="5">RG6</option>
                <option value="6">CAT5</option>
                <option value="7">RG59</option>
                <option value="8">LVT</option>
                <option value="9">CAT6</option>
                <option value="10">HDMI</option>
                <option value="11">Shielded CAT6</option>
            </select> </td>
        <td colspan="2">Length:
            <input type="text" class="id_wire_length_6" name="wire_length_6" value="0"></td>
        <td colspan="2">Retail Price:
            <input type="text" class="id_wire_retail_6" name="wire_retail_6" value="0"> </td>
        <td colspan="2" class="wire_total">
            <input type="hidden" id="wire_id_6" name="wire_id_6" value="0"><a href="#" class="delete-button" id="wiring_button_0">Delete</a></td>
    </tr>
</tbody>

用戶可以單擊“添加線”鏈接，它將生成上述表單中的另一個，但其名稱為wire_selector_1 ， wiring_rows_1和wiring_button_1而不是wire_selector_0 ， wiring_rows_0和wiring_button_0 。

現在說用戶刪除第0行，這將調用以下代碼：

deleteWire: function(part_id, row) {
        var node = Wireholder.wires[row];
        node.parentNode.removeChild(node);
        Wireholder.wires.splice(row, 1);
        for(var i=0;i<Wireholder.wires.length;i++)
        {
            var selectItem = Wireholder.wires[i].getElementsByTagName("select")[0];
            var buttonItem = Wireholder.wires[i].getElementsByTagName("a")[0];
            Wireholder.wires[i].id = "wiring_rows_" + i;
            selectItem.id = "wiring_select_" + i;
            buttonItem.id = "wiring_button_" + i;
            selectItem.onchange = function()
            {
                Estimate.select_wire(part_id, this.value, this.id.match(/\d+/));
            }
        }
        Estimate.total();
        return false;
    }

這將從數組中刪除該項並拼接它。

我需要發生的是，刪除行之后的所有行的類名都從例如：

example_class_1 to example_class_0

要么

example_class_3 to example_class_2

允許正確的商品定位。

Answer 1

這是非常簡單的循環和屬性操作。 就像在刪除項目后更改您的ID一樣，您可以使用className調整類。

Wireholder.wires[i].className = "convention" + i;
selectItem.className = "convention" + i;
buttonItem.className = "convention" + i;

Answer 2

我覺得這樣的事情可以解決問題;）

$('tr[class*="example_class_"]').each(function(i, node){
    $(node).attr('class', 'example_class_'+i);
});