Question

使用的是插件 http://www.eyecon.ro/bootstrap-datepicker/

我有两个日期选择器，即FROM DATE和TO DATE。条件是：如果我选择FROM DATE为11月25日，TO DATE应自动对焦，日期从11月25日开始（过去的日期被禁用）。

我已经使用过它，但是在11月25日作为禁用并且进一步的日期是活动的。如果我在FROM DATE选择25，我只需要让日期从11月25日开始。

使用以下代码：

    $(function(){
        var today = new Date();
        var st =new Date(today.getFullYear()-2,00,01);
        var et =new Date(today.getFullYear()+2,11,31);

        var fromDate = $('#dp').datepicker({
            startDate: new Date(today.getFullYear()-2,00,01),
            endDate: new Date(today.getFullYear()+2,11,31),
            beforeShowDay: function(date) 
                {       
                return date.valueOf() >= st.valueOf();
                }
        }).on('hide', function(ev) {

            var newDate = new Date(ev.date);
            **newDate.setDate(newDate.getDate());**
            toDate.setValue(newDate);
            toDate.setDate(newDate);
            toDate.update();

            fromDate.hide();
            $('#dp1')[0].focus();
        }).data('datepicker');

        var toDate = $('#dp1').datepicker({
            startDate: new Date(today.getFullYear()-2,00,01),
            endDate: new Date(today.getFullYear()+2,11,31),
            beforeShowDay: function(date) {
                var dd = $('#dp').val();        
                if(dd!='')
                    {
                    return date.valueOf() >= fromDate.date.valueOf();
                    }
                }
        }).data('datepicker');
    });

Answer 1

我要删除＆＃34; =＆＃34;从条件开始，只有它还包括选中的入住日期为未停用＆＃34;结帐日期＆＃34;，请在此处参考代码并粘贴一个简单的html文件并运行它...

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Datepicker for Bootstrap, from Twitter</title>
    <link href="http://www.eyecon.ro/bootstrap-datepicker/css/bootstrap.css" rel="stylesheet">
    <link href="http://www.eyecon.ro/bootstrap-datepicker/css/datepicker.css" rel="stylesheet">
    <style>
    .container {
        background: #fff;
    }
    #alert {
        display: none;
    }
    </style>
    <link href="http://www.eyecon.ro/bootstrap-datepicker/js/google-code-prettify/prettify.css" rel="stylesheet">
    <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
  </head>

  <body>
  <div class="container">
    <section id="typeahead">
          <div class="page-header">
            <h1>Datepicker for Bootstrap <small>bootstrap-datepicker.js</small></h1>
          </div>

          <p>Disabling dates in the past and dependent disabling.</p>
          <div class="well">
              <table class="table">
                <thead>
                  <tr>
                    <th>Check in: <input type="text" class="span2" value="" id="dpd1" ></th>
                    <th>Check out: <input type="text" class="span2" value="" id="dpd2" ></th>
                  </tr>
                </thead>
              </table>
          </div>

        </div>

    </section>
  </div>
    <script src="http://www.eyecon.ro/bootstrap-datepicker/js/google-code-prettify/prettify.js"></script>
    <script src="http://www.eyecon.ro/bootstrap-datepicker/js/jquery.js"></script>
    <script src="http://www.eyecon.ro/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
    <script>
    if (top.location != location) {
    top.location.href = document.location.href ;
  }
        $(function(){
            window.prettyPrint && prettyPrint();
            $('#dp1').datepicker({
                format: 'mm-dd-yyyy'
            });
            $('#dp2').datepicker();
            $('#dp3').datepicker();
            $('#dp3').datepicker();
            $('#dpYears').datepicker();
            $('#dpMonths').datepicker();


        // disabling dates
        var nowTemp = new Date();
        var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0);

        var checkin = $('#dpd1').datepicker({
          onRender: function(date) {
            return date.valueOf() < now.valueOf() ? 'disabled' : '';
          }
        }).on('changeDate', function(ev) {
          if (ev.date.valueOf() > checkout.date.valueOf()) {
            var newDate = new Date(ev.date)
            newDate.setDate(newDate.getDate());
            checkout.setValue(newDate);
          }
          checkin.hide();
          $('#dpd2')[0].focus();
        }).data('datepicker');
        var checkout = $('#dpd2').datepicker({
          onRender: function(date) {
            return date.valueOf() < checkin.date.valueOf() ? 'disabled' : '';
          }
        }).on('changeDate', function(ev) {
          checkout.hide();
        }).data('datepicker');
        });
    </script>
    <script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-106117-1";
urchinTracker();
</script>
  </body>
 </html>

Answer 2

$（'＃fromDate'）。datepicker（{ 格式：“ dd / mm / yyyy”， endDate：'+ 0d'，自动关闭：正确， pickTime：否，方向：“自动底部” }）。on（'changeDate'，函数（已选中）{ var startDate = new Date（selected.date.valueOf（））; $（'＃toDate'）。datepicker（'setStartDate'，startDate）; }）;

list

bootstrap Datepicker从日期和日期问题

2 个答案: