0

我有一个包含四个文本输入元素的表单。每次更新其中一个时，我希望四个文本输入框的总和显示在下面的 div 中，而无需用户按下按钮。这是我到目前为止所拥有的（我从这里得到了这个想法[这仅适用于 select 吗？]）：

var getSum = function() {
    var email = $('#emailDown').val();
    var internet = $('#internetDown').val();
    var server = $('#serverDown').val();
    var desktop = $('#pcDown').val();
    //TODO:Check for integers (not needed with sliders)
    var sum = email + internet + server + desktop;
    $('totalHoursDown').html(sum);
}
$('#emailDown').change(getSum(event));
$('#internetDown').change(getSum(event));
$('#serverDown').change(getSum(event));
$('#pcDown').change(getSum(event));

目前，它没有更新。（不用担心验证）。我是 PHP 新手，所以我不确定是否应该在这种情况下使用它。

4

2 回答 2

6

您的选择器中缺少#or .，具体取决于totalHoursDown是类还是 ID：

$('totalHoursDown').html(sum);

// Should be this if ID
$('#totalHoursDown').html(sum);
// or this if class
$('.totalHoursDown').html(sum);

更新：

我通过jmar777稍微修改了代码以使其工作。试试这个：

$(function(){
    var $fields = $('#emailDown, #internetDown, #serverDown, #pcDown'),
    $totalHoursDown = $('#totalHoursDown');
    $fields.change(function() {
        var sum = 0;
        $fields.each(function() 
                 { 
                     var val = parseInt($(this).val(), 10);
                     sum += (isNaN(val)) ? 0 : val; 
                 });
        $totalHoursDown.html(sum);
    });
});

这里也是一个工作小提琴：http: //jsfiddle.net/mSqtD/

于 2012-05-10T13:12:59.307 回答
1

尝试这个：

var $fields = $('#emailDown, #internetDown, #serverDown, #pcDown'),
    $totalHoursDown = $('#totalHoursDown');
$fields.change(function() {
    var sum = 0;
    $fields.each(function() { sum += $(this).val(); });
    $totalHoursDown.html(sum);
});

此外，在您的示例中，您有$('totalHoursDown').html(sum);，我假设它是一个 ID 选择器（即$('#totalHoursDown').html(sum);.

于 2012-05-10T13:15:20.680 回答