Question

我有一个复选框，但是已将值分配给该项目的名称。现在我有这个隐藏的字段，其值已分配给商品的价格。现在，当我使用隐藏字段运行我的jquery来计算所选项目的总和时，它不起作用。当我将价格和计算ID分配给复选框而不是隐藏字段时，它的工作方式相反。

这是我的jquery：

   <script type="text/javascript">
     function calcscore(){
      var score = 0;
        $(".calc:checked").each(function(){
         score+=parseInt($(this).val(),10);
              });
            $('#price').text(score.toFixed(2));
 $("input[name=sum]").val(score)
   }
  $().ready(function(){
  $(".calc").change(function(){
     calcscore()
 });
});
  </script>

我的HTML：

        <li>
        <label>
         <input class="calc" type="checkbox" name="seasoning[]"  value="Title1"/>
         The Title
         </label>
        <input type="hidden" name="title8" value="250">
       </li>


             <li>
               <label>
              <input class="calc" type="checkbox" name="seasoning[]"  value="Title1"/>The Title
         </label>
        <input type="hidden" name="title8" value="150">
       </li>

      <p>Total: PHP <span id="price">0</span></p>

任何见解都将受到高度赞赏。感谢

Answer 1

您的代码应该更像下面的解决方案并检查它在jsfiddle上的工作方式：https://jsfiddle.net/yehiaawad/wwtwmaLv/ 你的HTML：

    <li>
    <label>
     <input class="calc" type="checkbox" name="seasoning[]"  value="Title1"/>
     The Title
      <input type="hidden" name="title8" value="250">

     </label>
   </li>
         <li>
           <label>
          <input class="calc" type="checkbox" name="seasoning[]"  value="Title1"/>The Title
                  <input type="hidden" name="title8" value="150">
     </label>
   </li>
      <p>Total: PHP <span id="price">0</span></p>

你的JS

     function calcscore(){
      var score = 0;
        var checked=$(".calc:checked ~   input[type=hidden]").each(function(){
        score+=parseInt($(this).val());
        });
 $('#price').text(score.toFixed(2));
   }
  $(document).ready(function(){
  $(".calc").change(function(){
     calcscore()
 });
});

单击复选框时不能正常计算隐藏字段的值

1 个答案: