2016-01-22 123 views
1

我在我的代碼中使用了bootstrap-datepicker。如何在JavaScript中選擇當前日期並將其顯示爲選中狀態?在Bootstrap中設置當前日期datepicker

研究後,這是我使用的代碼,但作爲選擇當天不出現:

var today = moment(); 

datepicker1.datepicker({ 
    endDate: today.toDate() 
}); 

datepicker2.datepicker({ 
    startDate: today .toDate(), 
    endDate: today.toDate() 
}); 

datepicker1.datepicker('setDate', today.toDate()); 
datepicker2.datepicker('setDate', today.toDate()); 

datepicker1.datepicker('update'); //update the bootstrap datepicker 
datepicker2.datepicker('update'); 
+2

也許我想念的東西,但:'開始日期:新的Date()'???但是請等待,默認情況下它會選擇當前日期,因此我真的不確定要了解您的問題? –

+1

1.日期不在日期中輸入輸入字段 2.日期未被選中 - 日期選擇器 –

回答

9

不知道你正在使用和沒有HTML標記並沒有多大意義的代碼,

這裏是你是什麼樣的工作示例後

$(document).ready(function() { 
 
    var date = new Date(); 
 
    var today = new Date(date.getFullYear(), date.getMonth(), date.getDate()); 
 
    var end = new Date(date.getFullYear(), date.getMonth(), date.getDate()); 
 

 
    $('#datepicker1').datepicker({ 
 
format: "mm/dd/yyyy", 
 
todayHighlight: true, 
 
startDate: today, 
 
endDate: end, 
 
autoclose: true 
 
    }); 
 
    $('#datepicker2').datepicker({ 
 
format: "mm/dd/yyyy", 
 
todayHighlight: true, 
 
startDate: today, 
 
endDate: end, 
 
autoclose: true 
 
    }); 
 

 
    $('#datepicker1,#datepicker2').datepicker('setDate', today); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" /> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.1/js/bootstrap-datepicker.js"></script> 
 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.1/css/bootstrap-datepicker.min.css" /> 
 
<div class="row"> 
 
    <div class="col-lg-2"> 
 
<div class="panel"> 
 
    <fieldset> 
 
    <div class="form-group"> 
 
     <label for="datepicker1">Date</label> 
 
     <input type="text" class="form-control" id="datepicker1"> 
 
    </div> 
 
    </fieldset> 
 
    <fieldset> 
 
    <div class="form-group"> 
 
     <label for="datepicker2">Date2</label> 
 
     <input type="text" class="form-control" id="datepicker2"> 
 
    </div> 
 
    </fieldset> 
 
</div> 
 
    </div> 
 
</div>

7

即時通訊使用引導日期選擇器。下面的代碼對我有效:

$('#my-datepicker').datepicker('setDate', 'now'); 
1

使用minDate : moment()時選擇當前日期的問題。
解決的辦法是下面的代碼使用分配的DateTimePicker:

$('#datetimepicker6').datetimepicker({ 
    format: 'DD/MM/YYYY', 
    minDate: moment().millisecond(0).second(0).minute(0).hour(0), 
    clear : false 
}); 
相關問題