получение старого значения из события изменения

Question

Я использую html форму, которая помечена как date. Я хочу проверить старое значение после того, как .change называется

мой код:

$('#date').change(function(event) {
        event.preventDefault();
        $('#list_data').html('');
        $('#btndownload').hide();
        $('#btngenerate').hide();
        val = $(this).val(); //want to change it to old/previous value
        if(val || val !=""){
            console.log("this value: " +val);
            $('#btnview').show();
        }
        else{
            $('#btnview').hide();
            console.log("closed");
        }
    });

какая-либо подсказка?

Answer 1

$('#date').on('focusin', function() {
  $(this).data('val', $(this).val());
});


$('#date').change(function(event) {
  var prev = $(this).data('val');
  var current = $(this).val();
  console.log("Prev value " + prev);
  console.log("New value " + current);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input type="date" id="date" />

Answer 2

Вы можете сохранить старое значение в кэше, которым можно манипулировать, используя метод .data().

Кроме того, при необходимости используйте свойство defaultValue для получения значение по умолчанию, как изначально указано в HTML, который создал этот объект. Его можно получить, используя .prop() метод

$('#date').change(function(event) {
  var currentValue = $(this).val();
  var previousValue = $(this).data('previousValue');
  
  //if you want to get original value set in html
  var defaultValue = $(this).prop('defaultValue');  

  //set currentValue as previousValue
  $(this).data('previousValue', currentValue);
  
  console.clear();
  console.log("previousValue: " + previousValue);
  console.log("currentValue:" + currentValue);
  console.log("defaultValue: " + defaultValue);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="date" id="date" value="2020-01-21">