Question

我正在使用jQuery Mobile 1.3.1并希望拥有一个带日期选择器的表单。我查看了文档并想出了这个：

<input type="date" name="Anreise" id="Anreise" data-mini="true" />

这适用于iOS，但它将日期从本地格式转换为2013-04-30。

在Android上我发现表单不会提交，因为原生日期选择器会输出2013-4-30。在提交时弹出日期选择器，它表示您应该选择一个值。但我无法将值更改为2013-04-30。

这是如何正确完成的？ jQuery Mobile上的datpicker是否适用于所有浏览器和设备？

解决方案：

我使用了Mobiscroll：

<link rel="stylesheet" href="css/mobiscroll.core.css" />
<link rel="stylesheet" href="css/mobiscroll.ios.css" /> 
<script src="js/jquery-1.9.1.min.js"></script>
<script src="js/jquery.mobile-1.3.1.min.js"></script>
<script src="js/mobiscroll.core.js"></script>
<script src="js/mobiscroll.core-de.js"></script>
<script src="js/mobiscroll.datetime.js"></script>
<script src="js/mobiscroll.datetime-de.js"></script>
<script src="js/mobiscroll.ios.js"></script>
<script>
    $(function(){
        $("#Anreise").mobiscroll().date({
            lang: 'de',
            dateOrder: 'dd mm yy',
            dateFormat : "dd.mm.yy"
        });
    });
</script>

<input type="text" name="Anreise" id="Anreise" data-mini="true" />

Answer 1

不幸的是，HTML5规范没有提供一种定义日期格式的方法，说实话，这是一个非常糟糕的决定。

您可以随时为jQuery Mobile使用第三方日期选择器。

其中只有3个提示，并且每个都可以配置为显示某种日期格式，并且每个日期格式都适用于所有设备。你会推荐Mobiscroll，因为它的外观看起来像本机移动/桌面日期选择器。

Mobiscroll - http://jsfiddle.net/Gajotres/WDjfR/

$(document).on('pagebeforeshow', '#index', function(){       
    $('#demo').mobiscroll().date({
        invalid: { daysOfWeek: [0, 6], daysOfMonth: ['5/1', '12/24', '12/25'] },
        theme: 'android-ics',
        display: 'inline',
        mode: 'scroller',
        dateOrder: 'dd mm yy',
        dateFormat : "dd-mm-yy"
    });  
});

Mobipick - http://jsfiddle.net/Gajotres/zyVjE/

$(document).on('pagebeforeshow', '#index', function(){       
    $('#demo').mobipick({
        dateFormat: "MM-dd-yyyy"
    });
});

Datebox - http://jsfiddle.net/Gajotres/ktbcP/

<input name="mydate" id="mydate" type="date" data-role="datebox" data-options='{"mode": "datebox", "useNewStyle":true, "dateFormat": "mm/dd/YYYY"}'/>

如果您想了解更多有关jQuery Mobile日期选择器的信息，请查看 article 。

Android上的输入类型日期验证

1 个答案: