jquery 如果选中行，则对列求和

Question

我把这个 table 变成模态形式：

<div class="form-group">
    <!-- Record list -->
    <table id="tabscarichi" class="table table-bordered table-striped" style='border-collapse: collapse;' >
        <tr style='background: whitesmoke;'>
            
            <th>Check</th>
            <th>Id</th>
            <th>Formulario</th>
            <th>EER</th>
            <th>Data FR</th>
            <th>Q.tà</th>
        </tr>

            <?php 
            $query = "SELECT * FROM registro_c_s where stato_carico='1'";
            $result = mysqli_query($conn,$query);

            while($row = mysqli_fetch_array($result) ){
                $id = $row['id'];
                $fr = $row['formulario'];
                $data = $row['data_fr'];
                $eer = $row['codice_eer'];
                $qta = $row['quantità'];
                $stato = $row['stato_carico'];
            ?>
        <tr>

            <!-- Checkbox -->
            <td><input type='checkbox' class="box" name='update[]' value='<?= $id ?>' ></td>
            
            <td><?= $id ?></td>
            <td><?= $fr ?></td>
            <td><?= $eer ?></td>
            <td><?= $data ?></td>
            <td class="qta_scarichi"><?= $qta ?></td>

        </tr>
            <?php

            }
            
            ?>
    </table>
</div>

我正在尝试编写一个脚本来对 class 的值求和。qta_scarichi 并使用 .qtas class.

在另一个输入数字中报告它

我试过这个：

$('.box').change(function(){
   var total = 0;
   $('.box:checked').each(function(){
        total+=parseFloat($(this).parent().next('td').find('.qta_scarichi').text());
   });
   $('#qtà').val(total); 
});

但是当我检查一些行时..没有任何反应..#qtà 是我要填写的输入数字的id..

Answer 1

$(this).parent().next('td') 只选择 <td><?= $id ?></td>，不包含 .qta_scarichi.

使用$(this).closest('tr').find('.qta_scarichi').

我怀疑您可能有意 ".siblings('td'). .next()` 仅选择紧随其后的元素。

Answer 2

发现问题！在 table 中，id="tabscarichi" 我有以下脚本：

$(function() { 
$('#tabscarichi').hide(); 
$('#tipo').change(function(){ 
if($('#tipo').val() == 'scarico') { 
$('#tabscarichi').show(); 
console.log('0'); } 
else { $('#tabscarichi').hide(); 
} }); }); </script> ``` 

i choose to show the table with a select... if i disable the script.. the css selector works! But i don't understand why..

jquery 如果选中行，则对列求和

jquery sum column if row checked

php

checkbox

jquery

loops

sum