jquery - 使用 jquery 1.9 引导日期选择器

Question

我正在尝试这个datepicker 插件。我似乎无法让它工作。引导程序与 jquery 1.9+ 不兼容吗？

<div class="alert alert-error" id="alert">
    <strong>Oh snap!</strong>
</div>
<table class="table">
    <thead>
        <tr>
          <th>
              Start date
              <a href="#" class="btn small" id="date-start" data-date-format="yyyy-mm-dd" data-date="2012-02-20">Change</a>
          </th>
          <th>
              End date
              <a href="#" class="btn small" id="date-end" data-date-format="yyyy-mm-dd" data-date="2012-02-25">Change</a>
          </th>
        </tr>
    </thead>
    <tbody>
        <tr>
          <td id="date-start-display">2012-02-20</td>
          <td id="date-end-display">2012-02-25</td>
        </tr>
    </tbody>
</table>

知道我缺少什么吗？这是我的代码

Answer 1

你去了.. http://jsfiddle.net/jbDUe/2/ 你忘了加载 datepicker-plugin.js。

我已将其添加为外部资源，一切正常。

使用此 GitHub CDN 将您的文件加载到 jsFiddle 外部资源中： https ://raw.github.com/eternicode/bootstrap-datepicker/master/js/bootstrap-datepicker.js

var startDate = new Date(2012,1,20);
var endDate = new Date(2012,1,25);

$('#date-start')
    .datepicker()
    .on('changeDate', function(ev){
        if (ev.date.valueOf() > endDate.valueOf()){
            $('#alert').show().find('strong').text('The start date must be before the end date.');
        } else {
            $('#alert').hide();
            startDate = new Date(ev.date);
            $('#date-start-display').text($('#date-start').data('date'));
        }
        $('#date-start').datepicker('hide');
    });
$('#date-end')
    .datepicker()
    .on('changeDate', function(ev){
        if (ev.date.valueOf() < startDate.valueOf()){
            $('#alert').show().find('strong').text('The end date must be after the start date.');
        } else {
            $('#alert').hide();
            endDate = new Date(ev.date);
            $('#date-end-display').text($('#date-end').data('date'));
        }
        $('#date-end').datepicker('hide');
    });