Question

我有一个动态创建的tr表，其总和在底部（总计不是动态创建的）。

var tmp = '<tr id="mytable"> <td id="warenid">'+data1.id+'</td> <td id="Bezeichnung">'+data1.title+'</td>  <td id="preis">'+prc+'€</td> <td><select id="menge" name="maximum10">';
tmp += '<option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option>';
tmp += '<option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option>';
tmp += '</select></td><td class="su" id="summe">'+prc+'</td> <td><a id="removeBestellung" class="btn1" type="button"><i class="fa fa-trash" aria-hidden="true"></i></a> </td>'; //removebestellung kommt später DONT FORGET
tmp += '</tr>';
$("#upper").after(tmp);
}

$(".total").append(sum+"€");

现在，我想遍历创建的表（肯定大于1）并更新每行的总和。最后，我也想计算所有总和并替换总和。我试过了：

$( "select" ).change(function() {
    var sv = parseInt($(this).val());
    alert( "wert dropdown:" + sv );
    var newsum = 0;
    $("#mytable").each(function () {
        var preis_str = $(this).find("td").eq(2).html();
        var preis = parseInt(preis_str.slice(0, preis_str.length  - 1));
        alert("preis ohne euro " + preis);
        $(this).find("td").eq(4).html(preis * sv + "€");
        newsum = newsum + (preis * sv);
    })
    $(".total").html(newsum +"€");
});

问题在于，仅第一行的总和被更新，并且总和也根据第一行而刷新。我该如何遍历动态表中的所有行？

html表如下：

<p id=msg2 style="color:red; text-align: center;"></p>
<table id="myTable">
    <thead>
        <tr>
            <th colspan="7">Warenkorb</th>
        </tr>
    </thead>
    <tbody id="table">
        <tr id="upper">
            <td>ID</td>
            <td>Bezeichnung</td>
            <td>Preis</td>
            <td>Menge</td>
            <td>Summe</td>
            <td>Aktion</td>
        </tr>
        <tr>
            <td> </td>
            <td> </td>
            <td> </td>
            <td>Gesamt Preis:</td>
            <td class="total"></td> 
            <td> </td>
        </tr>
    </tbody>
</table>

Answer 1

ID仅出现一次。您可以更改表行（tr）项并向其中添加相同的类（例如class =“ myTableClassCalc”）。然后，您可以通过

对其进行迭代

$(".myTableClassCalc").each(function () {

如何使用动态创建的tr元素遍历表

1 个答案: