我需要在用户输入值时动态查找用户输入值的总和,并自动显示值的总和

i need to find the sum of user entered values dynamically as user enters the values and display the sum of values autometically

本文关键字:输入 用户 显示 动态 查找      更新时间:2023-09-26
var sum = 0;
$('.numbers').each(function() {
sum += parseInt($.text(this), 10);
});
$('.total').text(sum);

我尝试了上面的代码,但它不适用于动态值作为用户动态输入值。我需要我的代码来动态计算用户输入的值,并在用户输入值时显示值的总和,而不管输入的数量如何。

你可以使用这样的东西

.HTML

<table>
<thead>
    <th>Item</th>
    <th>Cost</th>
</thead>
<tbody id="tbody">
    <tr>
        <td>Item 1</td>
        <td>
            <input type="text" class="elm" />
        </td>
    </tr>
    <tr>
        <td>Item 2</td>
        <td>
            <input type="text" class="elm" />
        </td>
    </tr>
    <tr>
        <td>Item 3</td>
        <td>
            <input type="text" class="elm" />
        </td>
    </tr>
    <tr>
        <td>Item 4</td>
        <td>
            <input type="text" class="elm" />
        </td>
    </tr>
    <tr>
        <td>Item 5</td>
        <td>
            <input type="text" class="elm" />
        </td>
    </tr>
</tbody>
<tfoot>
    <tr>
        <td>Total</td>
        <td>
            <label id="total">0</label>
        </td>
    </tr>
</tfoot>

jQuery

    $('body').on('keyup','.elm',function(e){
    //Check Key Press is Enter
    if (e.keyCode != 13) {
        var sum = 0;
        $('.elm').each(function() {
            if($(this).val() != '' && !isNaN($(this).val())){
                sum += parseInt($(this).val());
            }
        });
        $('#total').text(sum);
    }
    else{
        var itemNum = $('#tbody tr').length + 1;
        var newRow = '<tr>'+
            '<td>Item'+itemNum+'</td>'+
            '<td>'+
                '<input type="text" class="elm">'+
            '</td>'+
        '</tr>';
        $('#tbody').append(newRow);
    }
});

您还可以使用 jQuery 的克隆函数从表中克隆 TR。那就靠你了。

小提琴

http://jsfiddle.net/hoja/y7ny6r5n/5/

你的语法有点不对劲,应该是:

var sum = 0;
$('.numbers').each(function() {
  sum += parseInt($(this).val());
});
$('.total').text(sum);

对于表单元素(<input><textarea>),你应该使用.val()方法来获取输入内容。

完整代码:

var sum = 0;
$('.numbers').each(function() {
  sum += parseInt($(this).val(), 10);
});
$('.total').text(sum);