在引导模式中显示输入的问题答案

【问题标题】：Problems showing an input in bootstrap modal在引导模式中显示输入的问题
【发布时间】：2019-12-06 14:03:27
【问题描述】：

当我单击一个图标时，我想显示一个引导模式，要求输入一些文本和一个日期。我已经从 W3Schools 复制了代码并进行了编辑以显示我需要的表单，但是当我单击按钮时，它显示标签、文本区域而不是输入日期。当我看到它显示导航器的代码时，我可以看到输入中有样式。具体来说，它有display: none，但我不知道是什么让输入具有这种风格。我正在使用引导程序，因此显示模态的函数是引导程序的原生函数。

我尝试将<input type='date'> 放入<label>，但它不起作用。

<div class="modal fade" id="modalHitos" role="dialog">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Nuevo hito</h4>
            </div>
            <div class="modal-body">
                <div class="form-group">
                    <label for="newHito">Hito</label>
                    <textarea class="form-control" rows="5" id="newHito"></textarea><br>
                    <label for="newDate">Fecha prevista</label>
                    <label><input type="date" id="newDate"></label>
                 </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal" onclick="saveHito()">Guardar</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
            </div>
        </div>
    </div>
</div>

我希望当我单击按钮时，它会显示带有两个标签和两个输入（文本区域和输入日期）的模式。但它不显示输入日期。

【问题讨论】：

它似乎工作正常：jsfiddle.net/xv3bLrt4
@Banzay 我看到它在该网站上按预期工作。我使用 Edge 来运行我的网页。那里没有显示输入。
这很奇怪。 My Edge 也显示日期输入
可以分享一下导航器的截图吗？具体是在哪里看到display: none？
@MaazSyedAdeeb 我在 Edge 的 DevTools 中看到了显示：无。按 F12。我将使用导航器的图像编辑帖子

标签： javascript jquery html bootstrap-4 bootstrap-modal

【解决方案1】：

我不确定，但我认为您的 css（插件）有问题。如果在检查输入时显示：无。您可以使用上面的代码来覆盖您输入日期的样式显示属性。

<input type="date" id="newDate" style="display: inline !important;">

【讨论】：