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'
});

它在控制台中出错：

未捕获的TypeError：无法读取未定义的属性“split”

这个确切的Working fiddle也不起作用。

Answer 1

$message = ["text" => "Hello Slack"];
echo json_encode($message);

尝试此操作以聚焦datepicker

Answer 2

Bootstrap没有自己的datepicker。根据我的猜测你必须使用https://bootstrap-datepicker.readthedocs.io/en/latest/。如果是这样，您必须具有日历的所有依赖项才能工作。

单击图标后日历不显示，但单击输入字段后显示

2 个答案: