输入字段已禁用，但glyphicon仍可单击

Question

我正在编写一个ReactJS应用程序，我想在日期/时间字段上禁用输入，其中包括react-bootstrap-datetimepicker。禁用输入字段工作正常，但用于显示日期选择器的字形在单击时仍处于活动状态，并允许用户选择添加到输入字段的日期。它似乎只是在阻止打字。

有没有人知道解决这个问题？

<DateTimeField
    inputFormat='HH:mm'
    data-hour-format="24"
    mode='time'
    name="formInputTime"
    id={inputID}
    defaultText={this._getICEField(i-1, "time")}
    onChange={this._generateEventHandler(i-1, "time")}
    inputProps={{disabled: readOnly}}
/>

在此图片中，输入字段设置为disabled，但仍会显示日历，并且可以设置日期：

以下是jsfiddle的示例。

Answer 1

好吧，控件现在不支持这个（也许它也不应该），所以你不应该运行

$element.datetimepicker()

在那些被禁用的输入字段上。您可以像这样检查禁用状态programmticaly：

var $startDate = $('#startDate');
if (!$startDate.prop('disabled')) {
    $startDate.datetimepicker()
}

Answer 2

试试这个，我刚刚更新了您的代码：JsFiddle。

相关代码：

if($("input[name=startDate]").attr('disabled') != 'disabled') {
    jQuery("#startDate").on("dp.change",function (e) {
        jQuery('#endDate').data("DateTimePicker").setMinDate(e.date);
    });       
    jQuery('#startDate').datetimepicker();
}