6

如何通过单击图标激活我的引导程序 DatePicker?

我的 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>

我想通过单击图标来激活我的日期选择器,但它不起作用。

我怎样才能做到这一点?

4

6 回答 6

12
<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-08T07:27:26.687 回答
8

你可以像这样完成它,但是你的 html 有一个小的变化。

<input type="text" class="datepicker" id="tb_date">  
<label class="add-on" for="tb_date">
  <i class="icon-calendar" id="cal2"></i>
</label>
于 2018-04-03T04:40:07.647 回答
4

docstextbox中,用divlike包裹你的 datepicker

<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>

然后将 datepicker 事件附加到divid 之类的

$("#dp3").datepicker();

JSFiddle

于 2014-01-08T07:31:53.870 回答
2

根据文档:

.datepicker('show') 显示日期选择器。

只需使用点击事件来显示您的日期选择器。

于 2014-01-08T07:26:33.233 回答
0
<script>
$(function(){
    $('.datepicker').datepicker({
        format: 'mm-dd-yyyy',
        endDate: '+0d',
        autoclose: true,
        showOn: "button",
        buttonImage: "images/calendar.gif",
        buttonImageOnly: true
    });
});
</script>
于 2014-01-08T07:23:39.670 回答