Question

我正在尝试设置date-picker的日期，从第一个date-picker选择日期，并且如果用户选择了另一个日期，则希望显示警告消息。我无法做到这一点。

这是我的代码：

$('#ELEdatepicker1').datepicker({
      autoclose: true,
      endDate: new Date(),
      todayHighlight: true,
    }).change(function(){
      getELEdifference($(this),$('#ELEdatepicker2'));
    });
    $('#ELEdatepicker2').datepicker({
      autoclose: true,
      startDate: new Date(),
      todayHighlight: true,
    }).change(function(){
      getELEdifference($('#ELEdatepicker1'),$(this));
      alert('Are you sure ?');
    });

  function getELEdifference($this1,$this2)
  {
    if($this1.datepicker("getDate") != null && $this2.datepicker("getDate") != null)
    {
      var ELEcertDiff= $this1.datepicker("getDate") - $this2.datepicker("getDate");    
      var result = ELEcertDiff / (1000 * 60 * 60 * 24) * -1;
      //$("#ELEcertDiff").text(result);
      document.getElementById("ELEcertDiff").value = result;
    }
  }

如何在第二个日期选择器中显示日期（假设一年后）？如果用户在一年之前或之后选择，它将在日期选择上显示警告消息。

更新： 是否可以传递参数来为第二个日期选择器设置差异？对于Ex。在上图中如果我从发行日期选择器和持续时间下拉列表框中选择一个日期，请选择一个值（例3），然后在到期日期选择器显示从所选日期起3年后的日期。

我提到了一些问题：

Jquery UI : date picker. How to set date in date picker by $_GET

Define start date of second date picker from first date picker

我是JavaScript和JQuery的新手。欢迎任何形式的帮助。提前谢谢。

Answer 1

检查此答案

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<input type="text" id="ELEdatepicker1">
<input type="text" id="ELEdatepicker2">
<!-- <input type="text" id="ELEcertDiff"> -->
<script>
$('#ELEdatepicker1').datepicker({
    autoclose: true,
    todayHighlight: true,
    dateFormat:'dd-mm-yy',
    onClose: function( selectedDate ) {
        var d = new Date(selectedDate);
        var year = d.getFullYear() + 1;
        var month = d.getMonth();
        var day = d.getDate();
        var newdate = year + "-" + month + "-" + day;
        $( "#ELEdatepicker2" ).datepicker( "option", "minDate", newdate );
         $('.highlight a', $(this).next()).addClass('ui-state-highlight');
    }
});

$('#ELEdatepicker2').datepicker({
    autoclose: true,
    todayHighlight: true,
    dateFormat:'dd-mm-yy',
    onClose: function( selectedDate ) {
        $("#ELEdatepicker2" ).datepicker( "option", "maxDate", selectedDate );
        $('.highlight a', $(this).next()).addClass('ui-state-highlight');
    }
});
</script>

Answer 2

plz添加并检查此代码：

$('#ELEdatepicker1').datepicker({
    autoclose: true,
    todayHighlight: true,
    dateFormat:'dd-mm-yy',
    onClose: function( selectedDate ) {
        var d = new Date(selectedDate);
        var day = d.getDate();
         var month = d.getMonth();
         var year = d.getFullYear() + 1;
        var newdate = month + "-" + day + "-" + year;
        $( "#ELEdatepicker2" ).datepicker( "option", "minDate", newdate );
         $('.highlight a', $(this).next()).addClass('ui-state-highlight');
    }
});

$('#ELEdatepicker2').datepicker({
    autoclose: true,
    todayHighlight: true,
    dateFormat:'dd-mm-yy',
    onClose: function( selectedDate ) {
        $("#ELEdatepicker2" ).datepicker( "option", "maxDate", selectedDate );
        $('.highlight a', $(this).next()).addClass('ui-state-highlight');
    }
});

如何在第一个日期选择器选择DATE时在第二个日期选择器中设置DATE？

2 个答案: