引导日期选择器无法单击图标答案

【问题标题】：bootstrap datepicker not able to click on icon引导日期选择器无法单击图标
【发布时间】：2014-02-28 19:18:58
【问题描述】：

如果我点击输入文本框，bootstrap calenar opend，con 是不可点击的。有人可以帮忙吗？

 </div>
  <div class ="form-group">
  <label class="col-sm-2 control-label" >Received Date</label>
 <div class="col-sm-2 input-group date" data-date-format="mm-dd-yyyy"> 
 <input class="text-input form-control" type="text" name="ARDT" id="ARDT" maxlength="10" />
 <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
 </div>

JSFIDDLE

【问题讨论】：

使用以下链接查看解决方案stackoverflow.com/questions/19444512/…

标签： datepicker twitter-bootstrap-3

【解决方案1】：

只需将 btn 类添加到此：

<span class="input-group-addon btn"><i class="glyphicon glyphicon-calendar"></i></span>

【讨论】：

现在可以点击了，但是点击时会自动展开文本框。也没有打开日历。jsfiddle.net/tK4f6/23

【解决方案2】：

pur 父类中的 id。见下面的代码：

 <div id="ARDT" class="col-sm-2 input-group date" data-date-format="mm-dd-yyyy">    
                                        <input class="text-input form-control" type="text" name="ARDT"  maxlength="10" />
                                        <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>                                         
                                        </div>
                                    </div>

【讨论】：

【解决方案3】：

也许有人需要它......

$('.glyphicon-calendar').on('click',function(){
  $('#ARDT').focus();
});

【讨论】：

【解决方案4】：

这是上述答案的有效组合。您需要添加“btn”类以使字形图标可点击。您需要添加“datepicker”类，以便可以在 jquery 中调用。您需要为“datepicker”类创建一个 jquery 点击事件。

<div class="input-group datepicker">
<input type='text' class="form-control"  id='datepicker2'/>
<span class="input-group-addon btn">
  <span class="glyphicon glyphicon-calendar"></span>
</span>
</div>

//这是为了让日历字形可点击

$('.datepicker').click(
    function () {
            $(this).datepicker('show');
    }
);

【讨论】：

【解决方案5】：

<div class="input-group date datepicker">
<input type="text" class="form-control" />
<span class="input-group-addon"><i class="fa fa-calendar"></i></span>
</div>

然后

$('.datepicker').off('focus').datepicker().click(
    function () {
        $(this).datepicker('show');
    }
);

这很好用。

【讨论】：