0

4つのテキスト入力要素を持つフォームがあります。そのうちの1つが更新されるたびに、ユーザーがボタンを押さなくても、4つのテキスト入力ボックスの合計が下の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

You are missing a # or . in your selector, depending on if totalHoursDown is a class or an ID:

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

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

Update:

I modified the code by jmar777 a bit to make it work. Try this instead:

$(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);
    });
});

​Here is a working fiddle as well: 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 に答える