以前使用过jQuery日期选择器,现在我将网站上表单中的一些日期字段转换为HTML5日期选择器。
在文档中,它说Safari是受支持的:但是,它目前只显示一个文本字段(而Chrome和其他浏览器则正确显示日期选择器)。
echo "<input type='date' name='Date' min='$todaymin'>";
(在不使用“最小”属性的情况下应用相同的设置)
这是我的代码行-我是做错了什么,还是我只是读错了留档,它不支持在Safari?
非常感谢。
Safari桌面版本不包括本机日期选择器(尽管iOS)。顺便说一句,IE也没有。这是非常令人沮丧的,因为如果开发人员这样做,它可以节省很多时间。
这是跟踪it支持的有用链接:http://caniuse.com/#feat=input-日期时间
虽然Safari(或IE)没有本机日期选择器,但一个很好的解决方法是在日期输入中添加一个占位符
属性。这将通知Safari和IE用户回退文本输入应该采用哪种格式(即yyyy-mm-dd
)。
占位符不显示在支持type="date"
的浏览器上,因此此解决方案不会影响其他浏览器。
例如
取自http://www.javascriptkit.com/javatutors/createelementcheck2.shtml
使用jQuery和jQuery UI,您可以创建一个跨浏览器的日期选择器,只有当浏览器本地不支持它时才会弹出。如果您的项目中已经有jQuery,只需执行以下操作:
var dateClass='.datechk';
$(document).ready(function ()
{
if (document.querySelector(dateClass).type !== 'date')
{
var oCSS = document.createElement('link');
oCSS.type='text/css'; oCSS.rel='stylesheet';
oCSS.href='//ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/base/jquery-ui.css';
oCSS.onload=function()
{
var oJS = document.createElement('script');
oJS.type='text/javascript';
oJS.src='//ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js';
oJS.onload=function()
{
$(dateClass).datepicker();
}
document.body.appendChild(oJS);
}
document.body.appendChild(oCSS);
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="date" name="datechk" class="datechk">