Question

您好我有一个包含多个输入/字段的表单。我使用下面的脚本查找输入到这些字段中的值的总和，而不是在用户离开字段输入后更新sum值字段，就像用户在字段输入框外部单击时一样。当用户键入值时，如何让此脚本自动更新总和显示的字段。

<script>
var $form = $('#contactForm'),
    $summands = $form.find('.sum1'),
    $sumDisplay = $('#itmttl');

$form.delegate('.sum1', 'change', function ()
{
    var sum = 0;
    $summands.each(function ()
    {
        var value = Number($(this).val());
        if (!isNaN(value)) sum += value;
    });

    $sumDisplay.val(sum);
});

</script>

Answer 1

您可以使用针对任何输入触发的input事件。它对使用微调器的新HTML5输入number也有效。

$('.num1').on("input",function(){
    var sum = 0;
    $.each($summands, function(){
        var n = $(this).val();
        sum = isNaN(n) || n == '' ? sum : sum+parseFloat(n); 
    });
    $('#sum').text(sum);
});

http://jsfiddle.net/6n4kugbp/

如何在用户输入时将表单字段设置为自动更新？

1 个答案: