日曆沒有顯示後點擊圖標，但顯示後點擊輸入字段

Question

我已經使用bootstrap的datepicker插件。但是，點擊圖標後，日曆不顯示。我必須點擊輸入字段才能顯示日曆？

<label for="dob" class="col-md-4 control-label">Date Of Birth</label> 
     <div class="col-md-6"> 
      <div class="input-group date"> 
       <input id="dob" class="form-control datepicker" placeholder="2012-02-12" type="text" name="dob" value="{{ old('dob') }}" required autofocus> 
      <div class="input-group-addon"> 
       <span class="glyphicon glyphicon-th"></span> 
      </div> 
    </div> 

腳本：

$('.datepicker').datepicker({ 
      format: 'yyyy-mm-dd' 
    }); 

後，我加入id來的父元素：

<label for="dob" class="col-md-4 control-label">Date Of Birth</label> 
      <div class="col-md-6"> 
       <div class="input-group date" id="datepicker"> 
        <input id="dob" class="form-control datepicker" placeholder="2012-02-12" type="text" name="dob" value="{{ old('dob') }}" required autofocus> 
       <div class="input-group-addon"> 
        <span class="glyphicon glyphicon-th"></span> 
       </div> 
     </div> 

和腳本：

$('#datepicker').datepicker({ 
     format: 'yyyy-mm-dd' 
}); 

它給出錯誤控制檯：

Uncaught TypeError: Cannot read property 'split' of undefined

這個確切的Working fiddle也不起作用。

Answer 1

Bootstrap沒有自己的日期選擇器。根據我的猜測，你必須使用https://bootstrap-datepicker.readthedocs.io/en/latest/。 如果是這樣，您必須具有日曆工作的所有依賴關係。

Answer 2

$('.glyphicon-th').click(function() { 
$(".datepicker").focus(); 
}); 

試試這個集中日期選擇器