在jquery datepicker中禁用以前的日期

时间:2016-04-15 12:59:22

标签: javascript jquery datepicker

我正在尝试实现一个jquery datepicker。我有两个输入文本框datepicker1和datepicker2。我试图根据第一个输入框上的用户日期选择禁用第二个输入框中的日期。这意味着应禁用第一个输入框上用户所选日期背后的日期。任何日期更改都相同 我尝试过以下但它不起作用:

<script>
  $(function(){

  $.datepicker.setDefaults(
     $.extend($.datepicker.regional['']) );

  //$('#datepicker').datepicker();


  var datepicker1=$('#datepicker1').datepicker({minDate: 'now'});
  //var datepicker2=$('#datepicker2').datepicker({minDate: 'now' + 1});
  var datepicker2=$('#datepicker2').datepicker
  (
    {minDate:($( ".datepicker1" ).datepicker( "getDate" ))+1}
  );
  //$('#datepicker').datepicker('option', $.datepicker.regional['fr']);



  });
</script>

html文件是:testjs.html

<!DOCTYPE html>
<html>
<head>

<!-- add scripts -->
<script src="js/jquery-1.12.3.js"></script>
<script src="js/jquery-ui.min.js"></script>
<link href="css/jquery-ui.min.css" rel="stylesheet" type="text/css" />

<script>
$(function(){

  $.datepicker.setDefaults(
     $.extend($.datepicker.regional['']) );

  //$('#datepicker').datepicker();


  var datepicker1=$('#datepicker1').datepicker({minDate: 'now'});
  //var datepicker2=$('#datepicker2').datepicker({minDate: 'now' + 1});
  var datepicker2=$('#datepicker2').datepicker
  (
    {minDate:($( ".datepicker1" ).datepicker( "getDate" ))+1}
  );
  //$('#datepicker').datepicker('option', $.datepicker.regional['fr']);



  });
</script>
</head>
<body>

<h1>My First Web Page</h1>
<p>My first paragraph.</p>



<input id="datepicker1" type="text" />
<input id="datepicker2" type="text" />
</body>
</html>

3 个答案:

答案 0 :(得分:0)

你可以试试这段代码

<script>
    $(function () {

        $("#datepicker1").datepicker({
            defaultDate: "+1w",
            changeMonth: true,
            numberOfMonths: 1,
            onClose: function (selectedDate) {
                $("#datepicker2").datepicker("option", "minDate", selectedDate);
            }
        });
        $("#datepicker2").datepicker({
            defaultDate: "+1w",
            changeMonth: true,
            numberOfMonths: 1,
            onClose: function (selectedDate) {
                $("#datepicker1").datepicker("option", "maxDate", selectedDate);
            }
        });
    });
</script>

有关详细信息,请访问此链接:https://jqueryui.com/datepicker/#date-range

答案 1 :(得分:0)

给予零注意,并且它会废除过去的日期。

$( "#datepicker" ).datepicker({ minDate: 0});

这是一个实时小提琴工作示例http://jsfiddle.net/mayooresan/ZL2Bc/

答案 2 :(得分:0)

$(function(){         $('。date_class')。datetimepicker({             minDate:0,             dayOfWeekStart:1,             lang:'en',             startDate:'date.now()',             formatTime:'g:i A',             步骤:30,
        });     });