文本框TextMode =“ Date”时，如何在边缘浏览器中清除输入的日期？

Question

在ASPX页面中，我有几个文本框，它们仅应接受日期格式的值。我添加了TextMode =“ Date”属性进行设置，它可以像在Chrome浏览器中输入和删除日期一样按预期工作，但是在Microsoft Edge浏览器中我无法删除输入的日期（Edge浏览器在文本框中未显示“ X”按钮例如Chrome）。

<asp:TextBox ID="txtSample" runat="server" TextMode="Date">

是否有一种简单的解决方法（例如在文本框中添加“ X”按钮）而不是客户日历？

边缘日期：

Chrome中的日期

Answer 1

Edge没有提供默认的清除按钮，因此一种解决方案是创建自己的函数以清除字段的值。

function clearDate() {
    var input = document.getElementById("txtSample");
    input.value = "";
}

输出HTML看起来像这样：

<input type="date" id="txtSample" placeholder="12-12-2017">
<button onclick="clearDate()">clear</button>

但是您仍将拥有Chrome UI，因此您可能希望使用以下方法完全删除Chrome版本：

#txtSample::-webkit-clear-button {
    display: none;
}