Javascript 标签在回发后失去值(value)

Question

我有一个 JavaScript 日期选择器。但是，在我向服务器进行回发后，标签将重置回默认值。我无法让它保留用户选择的值。

我尝试过移动我的代码。但没有任何喜悦。该值始终默认返回默认值。我是 javascript 的新手，所以也许我不完全理解页面生命周期。

$(document).ready(function() {
  $('#reportrange').daterangepicker({
      startDate: moment().subtract('days', 29),
      endDate: moment(),
      minDate: '01/10/2019',
      maxDate: '12/31/2050',
      dateLimit: {
        days: 90
      },
      showDropdowns: true,
      showWeekNumbers: true,
      timePicker: false,
      timePickerIncrement: 1,
      timePicker12Hour: true,
      ranges: {
        'Today': [moment(), moment()],
        'Yesterday': [moment().subtract('days', 1), moment().subtract('days', 1)],
        'Last 7 Days': [moment().subtract('days', 6), moment()],
        'Last 30 Days': [moment().subtract('days', 29), moment()],
        'This Month': [moment().startOf('month'), moment().endOf('month')],
        'Last Month': [moment().subtract('month', 1).startOf('month'), moment().subtract('month', 1).endOf('month')]
      },
      opens: 'left',
      buttonClasses: ['btn btn-default'],
      applyClass: 'btn-small btn-primary',
      cancelClass: 'btn-small',
      format: 'DD/MM/YYYY',
      separator: ' to ',
      locale: {
        applyLabel: 'Submit',
        fromLabel: 'From',
        toLabel: 'To',
        customRangeLabel: 'Custom Range',
        daysOfWeek: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
        monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
        firstDay: 1
      }
    },
    function(start, end) {
      console.log("Callback has been called!");
      $('#reportrange span').html(start.format('DD/MM/YYYY') + ' - ' + end.format('DD/MM/YYYY'));
      startDate = start;
      endDate = end;

      start = moment(start).format('YYYY-MM-DD HH:mm:ss');
      end = moment(end).format('YYYY-MM-DD HH:mm:ss');

      document.getElementById('<%= Hidden1.ClientID %>').value = start;
      document.getElementById('<%= Hidden2.ClientID %>').value = end;
    }
  );
  //Set the initial state of the picker label
  $('#reportrange span').html(moment().subtract('days', 29).format('DD/MM/YYYY') + ' - ' + moment().format('DD/MM/YYYY'));





});

function TestClick() {
  alert(startDate.format('DD/MM/YYYY') + ' - ' + endDate.format('DD/MM/YYYY'));
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />


<hr/>

<asp:HiddenField runat="server" ID="Hidden1" />
<asp:HiddenField runat="server" ID="Hidden2" />
<br />

我希望标签值保留用户的选择。但是，一旦页面回发以更新新详细信息，标签就会恢复为默认日期，但我需要它来保留用户所选内容的选择。

Answer 1

您可以使用“localStorage”和“sessionStorage”在客户端存储数据。
示例:

sessionStorage.setItem("name", "Smith");
var name = sessionStorage.getItem("name");