我正在使用以下datepicker：(
http://eternicode.github.io/bootstrap-datepicker/)作为我的日期 – 字段.
< input class =“datepicker”style =“width：100px; border-radius：4px;” type =“text”placeholder =“Datum”id =“startDate”.... 我正在使用两种不同的格式’dd.mm.yyyy’和’mm / dd / yyyy’并且外观很好.
但是在移动设备上,当我点击输入字段时键盘会打开.
因此我使用原生日期选择器< input type ='date'....但是这个不支持不同的格式. 无论如何在输入type = text元素上禁用键盘？ 或者你知道其他任何格式不同的日期选择器吗？ 谢谢你的帮助
解决方法
检查此
exmaple是否具有readonly但不是灰色输入,这是默认的bootstrap.
我对一个项目有同样的修复.
$(function() {
var ismobile = navigator.userAgent.match(/(iPad)|(iPhone)|(iPod)|(android)|(webOS)/i);
if (ismobile) {
$("#datepicker input").addClass('no-grey').prop('readonly',true);
}
$("#datepicker").datepicker({
autoclose: true,todayHighlight: true
}).datepicker('update',new Date());;
});
.no-grey {
background: #fff !important;
}
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" /> <link href="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.css" rel="stylesheet" /> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> <script src="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js"></script> <label>Select Date:</label> <div id="datepicker" class="input-group date" data-date-format="mm-dd-yyyy"> <input class="form-control" type="text" /> <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span> </div>