我正在寻找一种用Javascript(特别是jQuery)以编程方式清除HTML5日期字段的方法。到目前为止,我已经尝试了两种我认为显而易见的方法:
$('input[type=date]').val('');
$('input[type=date]').val('0000-00-00');
但至少他们都没有使用最新版本的Chrome for PC,还没有尝试过其他浏览器或平台。是否有API调用或可以跨浏览器方式清除日期字段的东西?我搜索的解决方案如this要求用户清除日期字段,而我需要以编程方式完成此操作。
答案 0 :(得分:7)
$("input[type=date]").val("")
适用于Chrome。它将输入字段设置为dd / mm / yyyy。
也许这是特定于浏览器的。大多数浏览器仅对此输入提供部分支持或不支持:http://caniuse.com/input-datetime
答案 1 :(得分:3)
我最近需要这样做,而且我做了这个小技巧...似乎可以完成这项工作。
这只是使用JavaScript,但jQuery版本几乎相同...
function reset_date_native() {
var date_input = document.getElementById('date-id');
//erase the input value
date_input.value = '';
//prevent error on older browsers (aka IE8)
if (date_input.type === 'date') {
//update the input content (visually)
date_input.type = 'text';
date_input.type = 'date';
}
}
function reset_date_jquery() {
$('#date-id').val('')
.attr('type', 'text')
.attr('type', 'date');
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="date-id" type="date" />
<button onclick="reset_date_native()">Trigger the reset function (native)</button>
<button onclick="reset_date_jquery()">Trigger the reset function (jQuery)</button>
答案 2 :(得分:2)
document.getElementById("datePicker").valueAsDate = null;
这行代码适用于我的浏览器(chrome),未在其他浏览器中测试
答案 3 :(得分:0)
您可以恢复占位符;
$('input[type=date]')[0].valueAsDate = '';
答案 4 :(得分:0)
此行适用于我的浏览器(chrome,最新版本)
$('input[type=date]')[0].value = 0;
答案 5 :(得分:0)
您可以使用表单的重置功能吗? 您可以使用重置按钮执行此操作:
<button type="reset" value="Reset">Reset</button>
或programmaticaly:
$("#yourFormId").reset();
或
$('input[type=date]').reset();
答案 6 :(得分:0)
使用原生defaultValue
属性:
$('input[type=date]').each( function resetDate(){
this.value = this.defaultValue;
} );
只要表单没有指定value
初始{{1}},就可以使用此功能。
答案 7 :(得分:0)
此解决方案检查是否存在默认值,如果存在,则使用它来重置输入。否则,它会通过更新value和valueAsDate清除输入。
有关valueAsDate的信息,请访问:w3c.org。
var dateEl = element.find('input#myDateInput[type="date"]');
dateEl[0].value = ('undefined' !== typeof dateEl[0].defaultValue) ? dateEl[0].defaultValue : '';
if (dateEl[0].value !== '') {
dateEl[0].valueAsDate = new Date(dateEl[0].value);
} else {
dateEl[0].valueAsDate = null;
}
答案 8 :(得分:0)
如果您无法清除日期字段,则还可能取决于浏览器错误。 我花了一些时间,直到发现禁用日期控件后,您无法在Firefox中重置日期。 参见:https://bugzilla.mozilla.org/show_bug.cgi?id=1465979
没有错误,我可以清除日期:
document.getElementById("myDate").value = "";
答案 9 :(得分:0)
您可以将日期更改为空
$('#invoiceDate').val(new Date())