如何獲取多個文本框值？

Question

我想使用相同的腳本獲取多個文本框的值。在我的腳本中，我正在獲取單個文本框的值更改前後的文本框值。我怎樣才能爲多個文本框編寫相同的JavaScript？

<div align="center"> 
    <table> 
    <tr> 
     <td> 
     <input type="text" id="bill" name="billid" class="update" 
       value="<?php echo $get['BillID']; ?>"> 
     </td> 
     <td> 
     <input type="text" id="proname" name="productname" class="update" 
       value="<?php echo $get['Productname']; ?>"> 
     </td> 
     <td> 
     <input type="text" id="rate" name="rate" class="update" 
       value="<?php echo $get['Rate']; ?>"> 
     </td> 
     <td> 
     <input type="text" id="quantity" name="quantity" class="update" 
       value="<?php echo $get['Quantity']; ?>"> 
     </td> 
     <td> 
     <input type="text" id="amount" name="amount" class="update" 
       value="<?php echo $get['Amount']; ?>"> 
     </td> 
    </tr> 
    <tr> 
     <td></td> 
     <td></td> 
     <td> 
     <input type="submit" name="submit" value="submit" onclick="sendvalue()"> 
     </td> 
    </tr> 
    </table> 
</div> 

我的劇本是

$('#bill').on('focus', function() { 
    $(this).data('val', $(this).val()); 
}); 

function sendvalue() { 
    var prev = $('#bill').data('val'); 
    var current = $("#bill").val(); 
    //alert(prev+";"+current); 

    $.ajax({ 
    type: "POST", 
    url: "updateedit.php", 
    data: ({ 
     previous: prev, 
     currentvalue: current, 
    }), 
    success: function(data) { 
     alert(data); 
    }, 
    error: function() { 
     alert('failed'); 
    }    
    }); 
} 

Answer 1

而不是使用id選擇嘗試通過輸入類型，還發出一個jQuery.each（）得到的結果。

$.each($("input[type=text]"), function(index, value) { 
     //What you want to do for every text input 
    }); 

Answer 2

首先按類別update選擇所有輸入併爲焦點事件附加事件列表器。

然後就可以調用sendvalue功能和發送對象的數組來批量更新所有的值到後端（改變你的PHP代碼收到一個數組，而不是一個單一的對象）

$('input.update').on('focus', function() { 
    $(this).data('val', $(this).val()); 
}); 

function sendvalue() { 
    // Array 
    var postData = []; 
    $('input.update').each(function() { 
    var inp = $(this); 
    postData.push({ 
     previous: inp.data('val'), 
     currentvalue: inp.val() 
    }); 
    }); 

    $.ajax({ 
    type: "POST", 
    url: "updateedit.php", 
    data: postData, 
    success: function(data) { 
     alert(data); 
    }, 
    error: function() { 
     alert('failed'); 
    }    
    }); 
}