I have multiple input fields and I want to apply key up JavaScript event on some of input field. Basically, I want to do some expense calculation and I want to get total expenses and set final expense amount in input field to display. So, I tried to apply keyup on multiple input field but did not worked. Kindly help me. Provide me some suggestion or solution if you get my question. If there is any doubt at any point, please ask me.

$('#tripfuel','#cardfee','#loadrepair','#shoprepair','#truckrent','#comcheck','#advance','#othercharge').on('keyup', function () {
        var fuel = document.getElementById('tripfuel').value;
        var cardfee = document.getElementById('cardfee').value;
        var onl oadrepair = document.getElementById('loadrepair').value;
        var shoprepair = document.getElementById('shoprepair').value;
        var trailerrent = document.getElementById('truckrent').value;
        var comcheck = document.getElementById('comcheck').value;
        var advance = document.getElementById('advance').value;
        var miscellenous = document.getElementById('othercharge').value;
        var expense = parseFloat(amount)-parseFloat(fuel)-parseFloat(cardfee)-parseFloat(onloadrepair)-parseFloat(shoprepair)-parseFloat(trailerrent)-parseFloat(comcheck)-parseFloat(advance)-parseFloat(miscellenous);
        console.log("Total Expense : || " expense); 
        document.getElementById('totalamount').value = parseFloat(expense).toFixed(2);
    }); 

CodePudding user response：

Try this way:

$('#tripfuel, #cardfee, #loadrepair, #shoprepair, #truckrent, #comcheck, #advance, #othercharge').on('keyup', function () {
    ...
});

https://api.jquery.com/multiple-selector/

CodePudding user response：

apply the class of all of your expenses input like

 <input type="text" class="expenses" />

then get the total value like this.

$('.expenses').on('keyup', function () {
   let totalExpense = 0;
    $(document).find("input.expenses").each(function(){
       totalExpense  = parseFloat($(this).val())
   })
});