您如何禁用引导表单字段？答案

【问题标题】：How do you disabled a bootstrap form field?您如何禁用引导表单字段？
【发布时间】：2015-12-31 01:06:24
【问题描述】：

我的意思是。

我在这里实现了一个引导日期时间选择器。 https://eonasdan.github.io/bootstrap-datetimepicker/

我的问题是。

如果你有一个输入框，你如何禁用它并只让 datetimepicker 的输入有效？因为用户可能输入了无效的日期格式。

下面的代码取自这里https://eonasdan.github.io/bootstrap-datetimepicker/#minimum-setup

代码：

<div class="container">
    <div class="row">
        <div class='col-sm-6'>
            <div class="form-group">
                <div class='input-group date' id='datetimepicker1'>
                    <input type='text' class="form-control" />
                    <span class="input-group-addon">
                        <span class="glyphicon glyphicon-calendar"></span>
                    </span>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            $(function () {
                $('#datetimepicker1').datetimepicker();
            });
        </script>
    </div>
</div>

【问题讨论】：

标签： javascript html jquery twitter-bootstrap

【解决方案1】：

您应该可以在文本输入上使用 readonly 属性，并且 jQuery 仍然可以编辑其内容。

<input type='text' id='foo' readonly>

【讨论】：

布尔属性中不允许使用值“true”和“false”。 w3.org/TR/html5/infrastructure.html#boolean-attributes
还是不行。我不知道为什么日历不会弹出

【解决方案2】：

您需要将disabled 属性添加到您的字段，如下所示：

<input type='text' class="form-control" disabled="true">

从技术上讲，这些其他选项也可以正常工作：

“禁用”的值

<input type='text' class="form-control" disabled="disabled">

或

根本没有值，只是属性的名称

<input type='text' class="form-control" disabled>

【讨论】：