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');
    }               
  });
}

如何获取多个文本框值？

2 个答案: