bootstrap datepicker只能选择小于今天的日期

最新推荐文章于 2025-09-15 12:57:52 发布

转载最新推荐文章于 2025-09-15 12:57:52 发布 · 1.1k 阅读

2 ·

本内容遵循CC 4.0 BY-SA版权协议

原文链接：http://www.cnblogs.com/xinbaba/p/7955225.html

标签

#php

本文介绍了一个简单的HTML日期选择器的实现方法，通过使用datepicker插件为输入框添加日期选取功能。该实现支持设置今天按钮、自动关闭、高亮显示今天日期及限定最大选择日期为当前日期等功能。

1、html代码

        <div class="date-picker pull-left">
            <div id="datepicker"></div>
            <div>
                <div class="input-group pull-left">
                    <span class="input-group-addon left-addon">
                        <img src="~/assets/img/datepicker-icon.png">
                    </span>
                    <input type="text" id="dp" name="dp" placeholder="加入开始日" value="" class="date-input">
                    <span class="input-group-addon right-addon"><i class="fa fa-angle-down"></i></span>
                </div>
                <div class="input-group pull-left" style="margin-left: 30px;">
                    <span class="input-group-addon left-addon">
                        <img src="~/assets/img/datepicker-icon.png">
                    </span>
                    <input type="text" id="end" name="end" placeholder="加入结束日" value="" class="date-input">
                    <span class="input-group-addon right-addon"><i class="fa fa-angle-down"></i></span>
                </div>
            </div>
        </div>

2、js代码

$('#dp').datepicker({
    todayBtn: "linked",
    autoclose: true,
    todayHighlight: true,
    endDate: new Date()
});
$('#end').datepicker({
    todayBtn: "linked",
    autoclose: true,
    todayHighlight: true,
    endDate: new Date()
});