Question

我正在尝试使用bootstrap输入类型'date'来创建带有日期选择器的输入字段，但是输入字段的格式似乎是由bootstrap的样式设置的，但似乎没有日期选择器正在该领域实施。当点击字段时，注意到了，我的打字不受限制。此输入类型的日期是否本身不会创建具有日期类型的输入字段，并使输入字段成为日期选择器？ JSBIN Code Here我的控制台显示没有错误。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
     <title>JS Bin</title>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
  <div class="container">
    <form>
      <div class="form-group">
        <div class="row">
          <div class="col-md-4 box">
            <label>Date</label>
            <input type="date" class="form-control" placeholder="Date">
          </div>
        </div>
      </div>
    </form>

如果有人能解释为什么它不起作用我会很感激。

Answer 1

原生<input type="date">仅适用于少数浏览器。 IE不是其中之一，虽然它现在可以在Edge中使用。请参阅此处的支持表：http://caniuse.com/#feat=input-datetime

您需要使用polyfill库或datepicker JS插件才能使其在任何地方都能正常运行。我建议查看Webshim：https://afarkas.github.io/webshim/demos/#Forms-forms-ext

Answer 2

Firefox和IE目前没有支持日期类型。

由于webshim库，我找到了一个简单的解决方法。我只需添加以下代码行，一切正常。注意：webshim库依赖于JQuery。

<script src="//cdn.jsdelivr.net/webshim/1.14.5/polyfiller.js"></script>
<script>
    webshims.setOptions('forms-ext', {types: 'date'});
    webshims.polyfill('forms forms-ext');
</script>

bootstrap input type =“date”not loading datepicker

2 个答案: