默认情况下,输入type="date"显示日期为YYYY-MM-DD。
问题是,是否可能将其格式强制为:DD-MM-YYYY?
默认情况下,输入type="date"显示日期为YYYY-MM-DD。
问题是,是否可能将其格式强制为:DD-MM-YYYY?
当前回答
如果你需要一个快速的解决方案,可以试试这个方法,让yyyy-mm-dd变成“dd- september -2016”
1)在您的输入附近创建一个span类(充当标签)
2)每次用户更改日期或需要从数据中加载时更新标签。
工作的webkit浏览器移动和指针事件的IE11+需要jQuery和jQuery日期
$("#date_input").on("change", function () { $(this).css("color", "rgba(0,0,0,0)").siblings(".datepicker_label").css({ "text-align":"center", position: "absolute",left: "10px", top:"14px",width:$(this).width()}).text($(this).val().length == 0 ? "" : ($.datepicker.formatDate($(this).attr("dateformat"), new Date($(this).val())))); }); #date_input{text-indent: -500px;height:25px; width:200px;} <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script> <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.min.js"></script> <input id ="date_input" dateformat="d M y" type="date"/> <span class="datepicker_label" style="pointer-events: none;"></span>
其他回答
我相信浏览器将使用本地日期格式。不要认为这是可能改变的。当然,您可以使用自定义日期选择器。
如果你需要一个快速的解决方案,可以试试这个方法,让yyyy-mm-dd变成“dd- september -2016”
1)在您的输入附近创建一个span类(充当标签)
2)每次用户更改日期或需要从数据中加载时更新标签。
工作的webkit浏览器移动和指针事件的IE11+需要jQuery和jQuery日期
$("#date_input").on("change", function () { $(this).css("color", "rgba(0,0,0,0)").siblings(".datepicker_label").css({ "text-align":"center", position: "absolute",left: "10px", top:"14px",width:$(this).width()}).text($(this).val().length == 0 ? "" : ($.datepicker.formatDate($(this).attr("dateformat"), new Date($(this).val())))); }); #date_input{text-indent: -500px;height:25px; width:200px;} <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script> <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.min.js"></script> <input id ="date_input" dateformat="d M y" type="date"/> <span class="datepicker_label" style="pointer-events: none;"></span>
自从这个问题被提出后,web领域发生了很多事情,其中最令人兴奋的是web组件的登陆。现在,您可以使用定制的HTML5元素优雅地解决这个问题,以满足您的需求。如果你想覆盖/改变任何html标签的工作方式,只需使用shadow dom构建你的。
好消息是,已经有很多可用的样板文件,所以很可能你不需要从头开始想出一个解决方案。看看人们在做什么,然后从中获得灵感。
你可以从一个简单(有效)的解决方案开始,比如聚合物的datetime-input,它允许你使用这样的标签:
<date-input date="{{date}}" timezone="[[timezone]]"></date-input>
或者您可以获得创意和弹出完整的日期选择器样式,如您所希望的,与格式和区域设置,回调,和您的长选项列表(您有一个完整的自定义API在您的处置!)
符合标准,没有黑客。
仔细检查可用的插件,它们支持哪些浏览器/版本,以及它是否覆盖了足够百分比的用户基础……现在是2018年,所以它肯定会覆盖你的大部分用户。
希望能有所帮助!
我在两年前搜索了这个问题,我的谷歌搜索再次把我带到了这个问题。 不要浪费时间试图用纯JavaScript处理这个问题。我把时间都浪费在日日夜夜的制作上了。没有适合所有浏览器的完整解决方案。所以我建议使用momentJS / jQuery datepicker,或者告诉你的客户端使用默认的日期格式
如上所述,<input type=date…>在大多数浏览器中都没有完全实现,所以让我们来谈谈webkit之类的浏览器(chrome)。
使用linux,您可以通过更改环境变量LANG, LC_TIME似乎不起作用(至少对我来说)。
您可以在终端中键入locale以查看当前值。我认为同样的理念也适用于IOS。
例如: 使用:
LANG=en_US.UTF-8 /opt/google/chrome/chrome
日期显示为mm/dd/yyyy
使用:
LANG=pt_BR /opt/google/chrome/chrome
日期显示为dd/mm/yyyy
您可以使用http://lh.2xlibre.net/locale/pt_BR/(根据您的语言环境更改pt_BR)来创建您自己的自定义语言环境并按照您想要的格式设置日期。
关于如何更改默认系统日期的一个更高级的参考是: https://ccollins.wordpress.com/2009/01/06/how-to-change-date-formats-on-ubuntu/ 而且 https://askubuntu.com/questions/21316/how-can-i-customize-a-system-locale
你可以看到你的真实当前日期格式使用date:
$ date +%x
01-06-2015
但是LC_TIME和d_fmt似乎被chrome拒绝了(我认为这是webkit或chrome中的一个bug),遗憾的是它不起作用。: ' (
所以,不幸的是,如果LANG环境变量不能解决你的问题,还没有办法。