引导的DateTimePicker不只读或禁用

我有引导datetimepicker一个严重的问题的工作，这里是jsfiddle：引导的DateTimePicker不只读或禁用

<br/> 
<!-- padding for jsfiddle --> 
<div class="row"> 
    <div class="col-md-12"> 
     <h6>datetimepicker1</h6> 

     <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-calendar glyphicon"></span></span> 
      </div> 
     </div> 
    </div> 
</div>

的问题是，当我在手机打开我的网站，移动键盘触发时我专注于输入领域，所以我需要的是只有datepicker没有键盘显示。因此，我使用readonly或disabled，但问题是，当我使用其中的一个引导datetimepicker不起作用。 http://jsfiddle.net/faissal_aboullait/kx0e5wmq/1/

来源

2015-05-18 Codinga

可能重复[防止iPhone默认键盘时聚焦]（http://stackoverflow.com/questions/7610758/prevent-iphone-default-keyboard-when-focusing-an-input） – DavidDomain

没有，因为我需要为所有移动设备提供解决方案。 android和iphone或其他 – Codinga

您所讨论的帖子是通过只读方式解决的。我的帖子是，这只读是一个问题请看这个请：http://jsfiddle.net/faissal_aboullait/kx0e5wmq/1/ – Codinga

如果您仍在寻找解决方案，请查看代码段。这正是我在评论中提出的建议，你只需要打电话给datetimepicker

ignoreReadonly: true

就是这样。

$(function() { 
 
    $('#datetimepicker').datetimepicker({ 
 
    ignoreReadonly: true 
 
    }); 
 
});

.container { 
 
    margin-top: 80px; 
 
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"/> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.7.14/css/bootstrap-datetimepicker.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.3/moment.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.7.14/js/bootstrap-datetimepicker.min.js"></script> 
 
<div class="container"> 
 
    <div class="row"> 
 
    <div class="col-sm-12"> 
 
     <div class='col-sm-6 col-sm-offset-3'> 
 
     <div class="form-group"> 
 
      <div class='input-group date' id='datetimepicker'> 
 
      <input type='text' class="form-control" readonly /> 
 
      <span class="input-group-addon"> 
 
       <span class="glyphicon glyphicon-calendar"></span> 
 
      </span> 
 
      </div> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>

使用图标来挑选你的日期，而不是文本字段。文本字段是只读的。

来源

2015-05-18 21:23:50 DavidDomain

不要工作，我在这里测试它：http://jsfiddle.net/faissal_aboullait/kx0e5wmq/2/ – Codinga

你看过这段代码吗？如果您在小提琴中打开控制台，它会显示“ignoreReadonly无法识别！”。这是因为您正在使用不同版本的datetimepicker。只需使用我的代码片段中的依赖关系，它就可以正常工作。 – DavidDomain

我无法更改依赖项，因为我使用此插件的主题。还有其他解决方案，而不改变依赖关系？ – Codinga

引导的DateTimePicker不只读或禁用

回答

相关问题