如何通過圖標激活引導日期選擇器

我的HTML代碼：

<input type="text" class="datepicker"> 
    <span class="add-on"><i class="icon-calendar" id="cal2"></i></span>

和腳本是：

<script> 
$(function(){ 
    $('.datepicker').datepicker({ 
     format: 'mm-dd-yyyy', 
     endDate: '+0d', 
     autoclose: true 
    }); 
}); 
</script>

我想通過點擊圖標來激活我的日期選擇器，但它無法正常工作。

我該如何做到這一點？

來源

2014-01-08 user2142786

哪個日期選擇器？ bootstrap-datepicker有很多分支;你在使用eternicode版本，eyecon版本還是其他的東西？ –

<script> 
$(function(){ 
    $('.datepicker').datepicker({ 
     format: 'mm-dd-yyyy', 
     endDate: '+0d', 
     autoclose: true, 
     showOn: "button", 
     buttonImage: "images/calendar.gif", 
     buttonImageOnly: true 
    }); 
}); 
</script>

來源

2014-01-08 07:23:39 Anup

你錯了，OP在說** bootstrap datepicker **，而你的答案是'jQuery datepicker'。 – Praveen

根據文檔：

.datepicker（ '秀'）顯示的日期選擇器。

只需使用單擊事件來顯示您的日期選擇器。

來源

2014-01-08 07:26:33 Loenix

需要解決。 – Praveen

<input type="text" id="my-datepicker" class="datepicker"> 
<span class="add-on"><i class="icon-calendar" id="cal2"></i></span> 

<script type="text/javascript">" 
    $('#cal2').click(function(){ 
     $(document).ready(function(){ 
      $("#my-datepicker").datepicker().focus(); 
     }); 
    }); 
</script>

來源

2014-01-08 07:27:26 makallio85

像魅力一樣工作。謝謝您的幫助。 +1 –

從docs，總結你的日期選擇器textbox與div像

<div class="input-append date" id="dp3"> 
    <input type="text" id="datepicker" /> 
     <span class="add-on"><i class="icon-calendar" id="cal2"></i></span> 
</div>

然後用div的ID連接的日期選擇事件類似