Php 如何使用jQuery计算输入字段的总成本？

我一直在网上寻找解决我问题的方法，但还没有找到。我希望有人能让我越过我遇到的障碍，或者给我指出正确的方向

我正在为玩家创建一个在线注册表单。到目前为止，当我使用jquery的datepicker选择出生日期时，它将根据我设置的特定日期返回用户的正确年龄。我使用switch语句根据所选的年龄在网页上显示正确的部门名称和价格值

到目前为止，一切似乎都正常运行

我现在的问题是，我似乎无法将每个价格的值作为目标，以便创建一个函数，将每个价格相加，得到一个总数

取自我的php文件的HTML部分：

<div>
    <div>
        <label for="player-birthdate-1">Birthdate</label>
        <input type="text" class="default-input" id="datepicker1" value="">
    </div>

    <div>
        <label for="player-division-1">Division</label> 
        <input type="text" id="playerDivision1" value="" disabled> 
    </div>

    <div>
        <p id="playerFee1" class="fee" value=""></p>
    </div>
</div>


<div>
    <div>
        <label for="player-birthdate-2">Birthdate</label>
        <input type="text" class="default-input" id="datepicker2" value="">
    </div>

    <div>
        <label for="player-division-2">Division</label> 
        <input type="text" id="playerDivision2" value="" disabled> 
    </div>

    <div>
        <p id="playerFee2" class="fee" value=""></p>
    </div>
</div>

<div>
    <p id="total" value=""></p>
</div>

<script>
    var divisions = {
        <?php
    $sql = $db->prepare("SELECT * FROM division");
    $sql->execute();
    $results = $sql->fetchAll(PDO::FETCH_OBJ);

    foreach ($results as $division) :
        ?>

            '<?php echo $division->division_id; ?>' : {
           id : '<?php echo $division->division_id;?>'
          ,name : '<?php echo $division->division_name;?>'
          ,price : '<?php echo $division->division_price;?>' 
            },

        <?php endforeach; ?>
    }
</script>

$(document).ready(function() {

    $( '#datepicker1' ).datepicker({
onSelect: function(value, ui) {
    var newDate = new Date("April 30, " + (new Date()).getFullYear()),
        dob = $("#datepicker1").datepicker("getDate"),
        age = new Date(newDate - dob).getFullYear() - 1970;
        $('#age').val(age);
        console.log(age);

        switch (age){

            case 5:
            case 6: 
                $("#playerDivision1").val(divisions['1'].name);
                $("#playerFee1").html(divisions['1'].price);
            break;

            case 7:
            case 8: 
                $("#playerDivision1").val(divisions['2'].name);
                $("#playerFee1").html(divisions['2'].price);
            break;

                            //continues on for the remaining of the ages.....

                },                      
                changeMonth: true,
                changeYear: true,
                dateFormat: 'yy-mm-dd', 
                yearRange: '1990:2012'


        });


    $( '#datepicker2' ).datepicker({
onSelect: function(value, ui) {
    var newDate = new Date("April 30, " + (new Date()).getFullYear()),
        dob = $("#datepicker1").datepicker("getDate"),
        age = new Date(newDate - dob).getFullYear() - 1970;
        $('#age').val(age);
        console.log(age);

        switch (age){

            case 5:
            case 6: 
                $("#playerDivision2").val(divisions['1'].name);
                $("#playerFee2").html(divisions['1'].price);
            break;

            case 7:
            case 8: 
                $("#playerDivision2").val(divisions['2'].name);
                $("#playerFee2").html(divisions['2'].price);
            break;

                            //continues on for the remaining of the ages.....

                },                      
                changeMonth: true,
                changeYear: true,
                dateFormat: 'yy-mm-dd', 
                yearRange: '1990:2012'


        });


    $('.fee').html(function(){

        var total = 0;

        $('.fee').each(function(){

            var fee = parseFloat($(this).val());
                        if (isNaN(fee)) {fee = 0;}
                        total+= fee;

            $('#total').html('$' + total);

        });
    });

});

---

我期待着论坛成员的建议。非常感谢您向正确方向提供的任何帮助或推动！：）

您已经完成了一项出色的工作，并且通过为每个人提供一类“费用”使其变得简单，但是我假设您希望解析浮点数，而不是parseInt（以防费用中有美分？）

另外，您需要检查它是否是isNaN（不是数字），否则它将无法正常工作。 只需添加以下内容：

if (isNaN(fee)) {fee = 0;}

---

最后，看起来你是在“改变”事件中这样做的。我在keyup事件中运气更好。

我认为发生的是这行代码：

从来没有人打过电话，也没有人在正确的时间打过电话

我的建议是将

.fee

内容包装在函数中。然后在日期选择器的select回调中调用该函数。（可能就在每次

中断之前；

语句）这样，每次日期更改时都会重新计算总数

您的函数如下所示：

function calcFee () {
  var total = 0;

  $('.fee').each(function () {
    ...
  });
}

---

如果在jQuery

each（）

函数循环中进行计算，则可以使用jQuery

$（this）.val（）

获取每个框中的值。然后您可以创建一个累计总数。

代码的当前行为是什么？请检查@ggreiner-您指的是我选择出生日期时当前发生的情况吗？如果是，则在单独的输入文本字段中显示部门名称和价格。我的问题是，我没有正确地确定价值目标，因此我可能会将价格加在一起作为一个总数。似乎显示，但在使用它添加时没有用处。谢谢@cale_b。将parseFloat视为一种价格是完全有道理的。我确实更改了代码以尝试您的建议，但它似乎还没有解决问题。我认为这是因为我没有正确地定位价值以增加价格。如果你使用Firefox，你可以添加一行代码，看看它是否在提高价格：console.log（fee）；-控制台日志通过错误控制台可见。我尝试了console.log，但它在注册时没有显示（费用）。沿着这条线的某个地方，我正在失去每一个的价值。抱歉，我的意思是，似乎没有注册（费用）。费用的潜在价值是什么？你能分享一个输入框中可能包含的值吗？你完全正确。它在开始时只调用函数一次，但在每次更改日期时不响应。非常感谢你！我应该补充一点，我把它放在每个switch语句之后，这同样有效。

function calcFee () {
  var total = 0;

  $('.fee').each(function () {
    ...
  });
}