Question

我在1个表单中有近100个HTML下拉列表，在提交之前，我想从所有下拉框中计算所选值的总和。目前，它无法正常工作。

jQuery的：

  <script type="text/javascript">

  $(function () {
      var fields = $('#addFullAuditReport :input').change(calculate);

      function calculate() {
          var score = 0;
          fields.each(function () {
              score += +$(this).val();
          })
           $('#price').html(score.toFixed(2));
      }
  })

  </script>

HTML表单字段示例：

  <div class="form-group">
    <div class="col-sm-1">1.4</div>
    <label for="1.4" class="col-sm-4 control-label"></label>
    <div class="col-sm-7">
      <select class="form-control" id="input" name="1_4">
        <option value="0">No</option>
        <option value="10">Yes</option>
      </select>
    </div>
  </div>

HTML输出

Total : <u id="price"></u>

表格启动：

{!! Form::open(array('route' => array('addFullHandHygieneAudit'), 
'role'=>'form','id'=>'addFullHandHygieneAudit', 'class'=>'form-horizontal')) !!}

我的问题是什么都没有添加到HTML输出。 jQuery可能是正确的，但我不能验证它，直到它被添加到该字段。

非常感谢任何帮助。

Answer 1

input中没有form个元素;将选择器更改为parentElement #input，例如; $(".form-group #input")。另外，将score.toFixed(2)替换为price.toFixed(2)

$(function() {
    var fields = $(".form-group #input").change(calculate);

    function calculate() {
      var score = 0;
      fields.each(function() {
        score += +$(this).val();
      })
      $('#price').html(score.toFixed(2));
    }
  })

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="form-group">
  <div class="col-sm-1">1.4</div>
  <label for="1.4" class="col-sm-4 control-label"></label>
  <div class="col-sm-7">
    <select class="form-control" id="input" name="1_4">
      <option value="0">No</option>
      <option value="10">Yes</option>
    </select>
  </div>
</div>

Total : <u id="price"></u>

Answer 2

看起来你有一个错字，改变

while True:
    try:
        return requests.head(...)
    except requests.exceptions.ConnectionError:
        time.sleep(0.5)

到

$('#price').html(price.toFixed(2));

Answer 3

你应该试试这样的

$(function () {
      var fields = $('select').change(calculate);

      function calculate() {
          var score = 0;
          fields.each(function () {
              var val = $(this).val();
              score += isNaN(val) ? 0 : parseFloat(val);
          })
           $('#price').html(score.toFixed(2));
      }
      calculate();
  })

Answer 4

我认为我们不能像这样使用更改事件处理程序。我的建议是：

$(function ()
    {
    $('#addFullAuditReport :input').change(function()
        {
        var fields = $('#addFullAuditReport :input');
        var score = 0;

        fields.each(function() {
            score += $(this).val();
            });

        $('#price').html(score.toFixed(2));
        }
    });

所有HTML字段值的总和不起作用

4 个答案: