Bootstrap datepicker不能在div上工作，

Question

我在我的HTML中使用了bootstrap datepicker。

<div class="col-md-5"> 
    <div> 
     <input id="my-date-picker" type="text" class="form-control" readonly required> 
    </div> 
</div> 

當我輸入元素上使用$('#my-date-picker').datepicker()，所有bootstrap datepicker methods工作完美。

但是當我使用

<div class="col-md-5"> 
    <div id="my-date-picker"> 
     <input type="text" class="form-control" readonly required> 
    </div> 
</div> 

的方法不起作用。我在這裏做錯了什麼？

Answer 1

您必須分配給輸入的編號，而不是分區

這個。

<div class="col-md-5"> 
    <div > 
     <input id="my-date-picker" type="text" class="form-control" readonly required> 
    </div> 
</div> 

Answer 2

你的第二個HTML示例沒有對input的id屬性，這是你需要實例上datepicker()的元素。

您需要爲使用這個，這裏id是在input直接：

<div class="col-md-5"> 
    <div> 
     <input id="my-date-picker" type="text" class="form-control" readonly="true" required="true"> 
    </div> 
</div> 

$('#my-date-picker').datepicker() 

或者這個，這裏id是父div，並且選擇孩子input：

$('#my-date-picker input').datepicker()