Html 是否有任何方法可以更改输入类型="；日期“；格式？
我正在使用网页上的HTML5元素。默认情况下，输入Html 是否有任何方法可以更改输入类型="；日期“；格式？,html,css,date,input,Html,Css,Date,Input,我正在使用网页上的HTML5元素。默认情况下，输入type=“date”将日期显示为YYYY-MM-DD 问题是，是否可以将其格式更改为：DD-MM-YYYY 我相信浏览器将使用本地日期格式。不要认为有可能改变。当然，您可以使用自定义日期选择器。无法更改格式。 我们必须区分有线格式和浏览器的表示格式 有线格式 是指，它指定的完整日期格式等于：yyyy-mm-dd。有关更多详细信息，请参阅RFC 3339规范的第1部分 此格式由valueHTML属性和DOM属性使用，是执行普通表单提交时使用的格式
type=“date”YYYY-MM-DD问题是，是否可以将其格式更改为：
DD-MM-YYYYyyyy-mm-ddvalueen-us01/30/201930-01-2019特别是Android上的Chrome，其格式基于Android显示语言。我怀疑其他浏览器也是如此，尽管我无法验证这一点。Google Chrome在其上一个测试版中最终使用了输入
type=dateDD-MM-YYYY- RFC 3339/ISO 8601“wire format”：YYYY-MM-DD。根据HTML5规范，这是表单提交时或通过DOM API请求时必须用于输入值的格式。它是区域独立的
- 由用户界面控件显示并接受为用户输入的格式。鼓励浏览器供应商遵循用户的首选项选择。例如，在语言和文本首选项窗格中选择了地区“美国”的Mac OS上，Chrome 20使用格式“m/d/yy”
HTML5规范不包括覆盖或手动指定任一格式的任何方法。不可能更改web kit浏览器使用用户计算机或手机的默认日期格式。 但是如果您可以使用jquery和jQueryUI，那么就有一个日期选择器，它是可设计的，并且可以按照开发人员想要的任何格式显示。 jQueryUI日期选择器的链接是 在此页面上，您可以找到演示以及代码和文档或文档链接 编辑：-我发现chrome使用的语言设置默认等于系统设置，但用户可以更改它们，但开发者不能强迫用户这样做，因此您必须使用其他js解决方案，如我所说，您可以使用javascript日期选择器或jquery日期选择器等查询搜索web，
LANGLC\u TIMElocalemm/dd/yyyyLANG=pt_BR /opt/google/chrome/chrome
dd/mm/yyyypt\u BRdate$ date +%x
01-06-2015
LC\u TIMEd\u fmt因此，不幸的是，答案是，如果环境变量不能解决您的问题，目前还没有办法。如果您需要快速解决方案，请尝试此方法使yyyy-mm-dd变为“dd-Sep-2016” 1） 在输入附近创建一个跨度类（充当标签） 2） 每次用户更改日期或需要从数据加载时，都要更新标签 适用于webkit浏览器手机，IE11+的指针事件需要jQuery和jQuery日期
$（“日期输入”）。关于（“更改”，函数（）{
$（this.css（“color”，“rgba（0,0,0,0）”）。兄弟姐妹（“.datepicker_标签”）.css（{“text align”）：“center”，位置：“绝对”，左：“10px”，顶部：“14px”，宽度：$（this）.width（））。text（$（this.val（）.length==0？”：（$.datepicker.formatDate（$（this.attr（“dateformat”），新日期（$（this.val（））））；
});
#日期{文本缩进：-500px；高度：25px；宽度：200px；}
如前所述，官方不可能更改格式。但是，可以设置字段的样式，因此（通过一点JS帮助）它以我们希望的格式显示日期。以这种方式操作日期输入的一些可能性丢失了，但是如果
$ date +%x
01-06-2015
<input type="date" data-date="" data-date-format="DD MMMM YYYY" value="2015-08-09">
<date-input date="{{date}}" timezone="[[timezone]]"></date-input>
<input type="date" id="dt" onchange="mydate1();" hidden/>
<input type="text" id="ndt" onclick="mydate();" hidden />
<input type="button" Value="Date" onclick="mydate();" />
#dt {
text-indent: -500px;
height: 25px;
width: 200px;
}
function mydate() {
//alert("");
document.getElementById("dt").hidden = false;
document.getElementById("ndt").hidden = true;
}
function mydate1() {
d = new Date(document.getElementById("dt").value);
dt = d.getDate();
mn = d.getMonth();
mn++;
yy = d.getFullYear();
document.getElementById("ndt").value = dt + "/" + mn + "/" + yy
document.getElementById("ndt").hidden = false;
document.getElementById("dt").hidden = true;
}
<html>
<body>
date :
<span style="position: relative;display: inline-block;border: 1px solid #a9a9a9;height: 24px;width: 500px">
<input type="date" class="xDateContainer" onchange="setCorrect(this,'xTime');" style="position: absolute; opacity: 0.0;height: 100%;width: 100%;"><input type="text" id="xTime" name="xTime" value="dd / mm / yyyy" style="border: none;height: 90%;" tabindex="-1"><span style="display: inline-block;width: 20px;z-index: 2;float: right;padding-top: 3px;" tabindex="-1">▼</span>
</span>
<script language="javascript">
var matchEnterdDate=0;
//function to set back date opacity for non supported browsers
window.onload =function(){
var input = document.createElement('input');
input.setAttribute('type','date');
input.setAttribute('value', 'some text');
if(input.value === "some text"){
allDates = document.getElementsByClassName("xDateContainer");
matchEnterdDate=1;
for (var i = 0; i < allDates.length; i++) {
allDates[i].style.opacity = "1";
}
}
}
//function to convert enterd date to any format
function setCorrect(xObj,xTraget){
var date = new Date(xObj.value);
var month = date.getMonth();
var day = date.getDate();
var year = date.getFullYear();
if(month!='NaN'){
document.getElementById(xTraget).value=day+" / "+month+" / "+year;
}else{
if(matchEnterdDate==1){document.getElementById(xTraget).value=xObj.value;}
}
}
</script>
</body>
</html>
/*================== || Date Picker ||=======================================================================================*/
/*-------Removes the // Before dd - day------------------------*/
input[type="date"]::-webkit-datetime-edit-text
{
color: transparent;
}
/*------- DatePicker ------------------------*/
input[type="date"] {
background-color: aqua;
border-radius: 4px;
border: 1px solid #8c8c8c;
font-weight: 900;
}
/*------- DatePicker - Focus ------------------------*/
input[type="date"]:focus
{
outline: none;
box-shadow: 0 0 0 3px rgba(21, 156, 228, 0.4);
}
input[type="date"]::-webkit-datetime-edit, input[type="date"]::-webkit-inner-spin-button, input[type="date"]::-webkit-clear-button {
color: #fff;
position: relative;
}
/*------- Year ------------------------*/
input[type="date"]::-webkit-datetime-edit-year-field {
position: absolute !important;
border-left: 1px solid #8c8c8c;
padding: 2px;
color: #000;
left: 56px;
}
/*------- Month ------------------------*/
input[type="date"]::-webkit-datetime-edit-month-field {
position: absolute !important;
border-left: 1px solid #8c8c8c;
padding: 2px;
color: #000;
left: 26px;
}
/*------- Day ------------------------*/
input[type="date"]::-webkit-datetime-edit-day-field {
position: absolute !important;
color: #000;
padding: 2px;
left: 4px;
}
// ================================ || Format Date Picker || ===========================================================
function GetFormatedDate(datePickerID)
{
let rawDate = document.getElementById(datePickerID).value; // Get the Raw Date
return rawDate.split('-').reverse().join("-"); // Reverse the date
}
document.getElementById('datePicker').onchange = function () { alert(GetFormatedDate('datePicker')); }; // The datepickerID