时间戳

首页 > 解决方案 > HTML5 日期选择器未显示在引导模式中

html - HTML5 日期选择器未显示在引导模式中

问题描述

有人可以帮我解决这个问题。我正在使用默认的 HTML5 日期选择器，但是日历没有显示在模式中。

<div id="detailsModal" class="modal" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title" id="detailsTitle">Applicant Details</h5>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body" id="detailsBody">
              <div class="card card-user">
                <div class="card-body details-group">
                  <div class="form-group">
                <label for="birthdate">Birth Date</label>
                <input type="date" name="birthdate" id="birthdate" class="form-control" placeholder="Birth Date">
              </div>        
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>

我正在使用这个本机引导库，因为我没有使用任何 jquery。

标签： htmlbootstrap-4bootstrap-modal

解决方案

HTML5 日期选择器可能对不同浏览器的支持有限。日历/日期选择器对我来说似乎出现在最新版本的 Chrome 上，但是当我在 Safari 上测试时它对我不起作用。你用什么测试它？

有关浏览器支持，请参阅以下链接：

• https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date

• <a href="https://caniuse.com/input-datetime" rel="nofollow noreferrer">https://caniuse.com/input-datetime

推荐阅读