繁体   English   中英

bootstrap input type="date" 未加载日期选择器

[英]bootstrap input type=“date” not loading datepicker

我正在尝试使用引导程序输入类型“日期”来创建一个带有日期选择器的输入字段,但是虽然输入字段的格式似乎是由引导程序的样式设置的,但似乎没有实现日期选择器在那个领域。 单击该字段时会出现注释并且我的输入不受限制。 这种输入类型的日期不是本机创建具有日期类型的输入字段并使输入字段成为日期选择器吗? JSBIN 代码在这里我的控制台没有显示任何错误。

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

如果有人能解释为什么它不起作用,我将不胜感激。

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

你需要使用 polyfill 库或 datepicker JS 插件才能让它在任何地方都能工作。 我建议查看 Webshim: https ://afarkas.github.io/webshim/demos/#Forms-forms-ext

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>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM