更改复选框时如何取回输入值？

Question

代码片段如下：

  $('.fee_checkbox').on("change",function() {
    if ($(this).prop('checked')==false) {
      $('.actual_pay').val('0');
    }  else {
      $('.actual_pay').val();
    }
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="checkbox" checked="checked" class="fee_checkbox">
<input type="text" class="actual_pay" value="1000">

这里选中复选框的默认行为，并且类actual_pay的输入框的值为1000.当用户取消选中该复选框时，actual_pay的值将更改为0。

在此之后，当用户再次单击该复选框时，我需要返回值1000但现在返回0。当用户取消选中并选中复选框时，我需要获得1000的值。

Answer 1

如您所说，您需要取回新输入的值，因此您需要使用data-attributes。

输入新值，此代码段显示如何获取这些新值。

$('.fee_checkbox').on("change", function() {
  var $actualPay = $('.actual_pay');
  if ($(this).prop('checked') == false) {
    $actualPay.data('current', $actualPay.val())
    $actualPay.val(0);
  } else {
    $actualPay.val($actualPay.data('current'));
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="checkbox" checked="checked" class="fee_checkbox">
<input type="text" class="actual_pay" value="1000" data-value="1000">

Docs

• .data()

Answer 2

您可以将值存储为data-

喜欢

<input type="text" class="actual_pay" value="1000" data-value="1000">

这是一个片段：

  $('.fee_checkbox').on("change",function() {
    if ($(this).prop('checked')==false) {
      $('.actual_pay').data("value",$('.actual_pay').val()) ;
      $('.actual_pay').val( 0 );
    }  else {
      $('.actual_pay').val( $('.actual_pay').data("value") );
    }
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="checkbox" checked="checked" class="fee_checkbox">
<input type="text" class="actual_pay" value="1000" data-value="1000">