Question

我有一个带日期输入的表单，我想阻止用户选择将来的日期：

＆＃13;

    $(document).ready(function(){
	    $('.month').datepicker({
			    format: 'yyyy-mm-dd',
			    endDate: '+1d',
	    });
    });

＆＃13;

<div>
	<div class="col-md-6">
		<div class="form-group">
			<div class="col-md-11 col-xs-11">
				<input type="text" readonly="" id="sale_from" placeholder="Click & Select From Date" value="" size="16" class="form-control month">
			</div>
		</div>
	</div>
	<div class="col-md-6">
		<div class="form-group">
			<div class="col-md-11 col-xs-11">
				<input type="text" readonly="" id="sale_to" placeholder="Click & Select To Date" size="16" class="form-control month">
			</div>
		</div>
	</div>
</div>

＆＃13;

Answer 1

嗯，除了语法错误之外，我看到你的代码是完美的 endDate参数，但它不会影响任何事情）

因此，请检查您正在使用的datepicker JS，因为有多个Bootstrap datepickers可用。

我提供了工作演示，请将相同的插件复制到您的应用中并进行测试。

 $('.month').datepicker({
            format: 'yyyy-mm-dd',
            endDate: '+1d'
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.0/js/bootstrap-datepicker.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.0/css/bootstrap-datepicker.css" rel="stylesheet"/>


<div>
<div class="col-md-6">
    <div class="form-group">
        <div class="col-md-11 col-xs-11">
            <input type="text" readonly="" id="sale_from" placeholder="Click & Select From Date" value="" size="16" class="form-control month">
        </div>
    </div>
</div>
<div class="col-md-6">
    <div class="form-group">
        <div class="col-md-11 col-xs-11">
            <input type="text" readonly="" id="sale_to" placeholder="Click & Select To Date" size="16" class="form-control month">
        </div>
    </div>
</div>

Answer 2

请尝试这个，而不是endDate，你应该使用maxDate参数。

<!DOCTYPE html>
<html>
<head>
 <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$(document).ready(function(){
    $('.month').datepicker({
            format: 'yyyy-mm-dd',
            maxDate: new Date, minDate: new Date(2007, 6, 12) 
    });
});
</script>
</head>
<body>
<div>
<div class="col-md-6">
    <div class="form-group">
        <div class="col-md-11 col-xs-11">
            <input type="text" readonly="" id="sale_from" placeholder="Click & Select From Date" value="" size="16" class="form-control month">
        </div>
    </div>
</div>
<div class="col-md-6">
    <div class="form-group">
        <div class="col-md-11 col-xs-11">
            <input type="text" readonly="" id="sale_to" placeholder="Click & Select To Date" size="16" class="form-control month">
        </div>
    </div>
</div>
</body>
</html>

禁用Bootstrap datepicker

2 个答案: