首页 > 解决方案 > 如何计算复选框的值?

问题描述

我有包含以下数据结构的表:

ID payroll_cat_name payroll_cat_code 类别类型 数量
1 公积金 PF 扣除 1000
2 基本工资 公元前 收入 35000
3 旅行 助教 收入 6500
4 家庭津贴 HM 收入 12000
5 德克萨斯州 扣除 500

我正在使用以下代码获取所有数据:

<?php
include "../db.php";
$select_payroll_category = "SELECT * from payroll_category";
$employee_payroll_result = mysqli_query($con,$select_payroll_category);
?>
<table>
    <thead style="color: #222426;">
        <tr>
            <th>
                <div class="form-check">
                    <input type="checkbox" class="form-check-input checkAll">
                    <label class="form-check-label">ID</label>
                </div>
            </th>
            <th>Category name</th>
            <th>Category code</th>
            <th>Category Type</th>
            <th>Category Amount</th>
            <th>Action</th>
        </tr>
    </thead>
    <tbody>
        <?php
        while ($row = mysqli_fetch_array($employee_payroll_result)) {
            echo "<tr style='color:#222426;'>
                    <td>
                    <div class='form-check'>
                    <input type='checkbox' name='payroll_group' value=".$row["amount"]."class='form-check-input'>
                    <label class='form-check-label' style='color:#fff;'>".$row["payroll_cat_id"]."</label>
                    </div>
                    </td>
                    <td>".$row["payroll_cat_name"]."</td>
                    <td>".$row["payroll_cat_code"]."</td>
                    <td>".$row["category_type"]."</td>
                    <td>".$row["amount"]."</td>
                    
                  </tr>";
                    }
                    ?>
                        
                    </tbody>
                </table>
                <button id="button">save</button>
                <p id="result"></p>

现在button点击我想根据 category_type 计算金额,

如果类别是,earning那么它将添加金额,

如果类别是,dedution那么它将减去金额,

使用 jquery,我想执行此操作

以下是我尝试过的jquery代码,

<script type="text/javascript">
    $(document).ready(function(){
        $("#button").click(function(){
            var favorite = [];
            $.each($("input[name='payroll_group']:checked"), function(){
                favorite.push($(this).val());
            });
            var total = 
            console.log("My favourite sports are: " + favorite);
            $('#result').html(favorite);
        }); 
    });
</script>

通过使用此代码,我得到1000,35000,6500了我在复选框中勾选的金额的值

标签: phpjquerycheckbox

解决方案


试试这个

<body>
    <table>
        <tbody>
            <tr>
                <td><div><input type="checkbox"></div></td>
                <td>...</td>
                <td>...</td>
                <td>deducing</td>
                <td>1000</td>
            </tr>
            <tr>
                <td><div><input type="checkbox"></div></td>
                <td>...</td>
                <td>...</td>
                <td>earning</td>
                <td>6000</td>
            </tr>
            <tr>
                <td><div><input type="checkbox"></div></td>
                <td>...</td>
                <td>...</td>
                <td>earning</td>
                <td>3000</td>
            </tr>
            <tr>
                <td><div><input type="checkbox"></div></td>
                <td>...</td>
                <td>...</td>
                <td>earning</td>
                <td>1200</td>
            </tr>
            <tr>
                <td><div><input type="checkbox"></div></td>
                <td>...</td>
                <td>...</td>
                <td>deducing</td>
                <td>1000</td>
            </tr>
        </tbody>
    </table>
    <button type="button" id="button">Yo</button>
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
    <script>
        $(function() {
            $("#button").click(function() {
                let total = 0;
                $("tbody:first tr").each(function() {
                    if ($(this).children("td").first().children("div").children("input").is(":checked")) {
                        if ("deducing" == $(this).children("td").eq(3).text()) total = total - parseInt($(this).children("td").eq(4).text());
                        else if ("earning" == $(this).children("td").eq(3).text()) total = total + parseInt($(this).children("td").eq(4).text());
                    }
                });
                alert(total);
            });
        });
    </script>
</body>


推荐阅读