如何在日历javascript中停用以前的日期?

时间:2018-04-04 04:59:45

标签: javascript php html codeigniter calendar

我正在尝试禁用日历中的先前日期。我正在使用此代码,如

我的 HTML 代码如下。

<input type="text" required name="date_from" name="date_from" class="mydate input-text full-width" placeholder="Departure Date" />

我的脚本代码。

<script type="text/javascript">
 $(".mydate").datepicker({
       format:'yyyy-mm-dd',
       autoclose: true
   });
    $(".flexslider").flexslider({
        animation: "fade",
        controlNav: false,
        animationLoop: true,
        directionNav: false,
        slideshow: true,
        slideshowSpeed: 5000
    });
</script>

它显示日历没有禁用之前的日期。

非常感谢您的帮助,谢谢你们!

7 个答案:

答案 0 :(得分:1)

试试这个:

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

答案 1 :(得分:0)

在datepicker

的初始化中设置minDate
minDate:new Date()


$(".mydate").datepicker({
       format:'yyyy-mm-dd',
       autoclose: true,
       minDate:new Date()
   });

答案 2 :(得分:0)

您必须设置minDate选项。示例+小提琴在这个论坛上:

jQuery Date Picker - disable past dates

答案 3 :(得分:0)

您需要在应用datepicker时设置minDate选项。

试试这个,

<script type="text/javascript">
$(".mydate").datepicker({
       format:'yyyy-mm-dd',
       autoclose: true,
       minDate: 0,   
}); 
</script>

答案 4 :(得分:0)

从您的格式可能是您正在使用引导日期选择器。因此,请使用startDate停用以前的日期

$(".mydate").datepicker({
       format:'yyyy-mm-dd',
       startDate: new Date(),
       autoclose: true
   });

答案 5 :(得分:0)

使用bootstrap date picker。这些是要包含的文件

<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.css" rel="stylesheet" type="text/css" />

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js"></script>

使用此代码禁用以前的日期

HTML输入字段

<input id="date" data-provide="datepicker" name="date_from" >

JAVASCRIPT

var date = new Date();
date.setDate(date.getDate());

$('#date').datepicker({ 
startDate: date
});

答案 6 :(得分:0)

尝试此代码...如果用户提交的日期小于今天的日期,然后显示警报消息以更改日期,这将限制用户。

HTML代码

    <form name="myform" onsubmit="return validateDateOfAppointment()">
    <input type="date" name="Date of Appointment" placeholder="Date of Appointment" id="Date" />
</form>

JavaScript代码

function validateDateOfAppointment(){
        var date=document.getElementById("Date").value;
        var d=new Date();
        var x=d.getFullYear()+"-"+(d.getMonth()+1)+"-"+d.getDate();
        var checkDate=date.substr(8,2);
        var equalDate=d.getDate();
        var checkMonth=date.substr(5,2);
        var equalMonth=d.getMonth();
        var checkYear=date.substr(0,4);
        var equalYear=d.getFullYear();
        if(checkMonth>=equalMonth){
            if(checkDate<equalDate){
            alert("Date cannot be less than today!! ");
            return false;
            }
        }
        else if(checkMonth<equalMonth){
            if(checkYear<equalYear){
                alert("Date cannot be less than today!! ");
                return false;
            }
        }
     }