<input type =“date”> - jQuery catch事件清除日期

Question

通过单击x删除日期时，我不知道如何捕获清除日期的事件。 click事件没有用，因为我得到了change事件。

HTML：

清除x的日期字段

我想在点击x时捕捉到这个事件（见图）。 任何提示？

使用jQuery v3.2.1和Bootstrap v3

Answer 1

你可以只听取改变事件。 此脚本应该使用或不使用jQuery，并在设置值和单击清除按钮时写入控制台：

 var input = document.getElementsByTagName('input')[0]; input.addEventListener('change', function(e) { if (!input.value) console.log('clear!'); else console.log('value', input.value); }); 

 <input type="date" /> 

Answer 2

谢谢Keith，这对我的解决方案来说是一个很好的启发。

我在项目中使用了jquery，所以我需要一个jquery的解决方案。

这个js解决方案解决了一个问题，但另一个问题是：如果加载页面并通过单击清除按钮（“x”）删除日期值，则更改事件无法识别它。 解决方案：

$('.date-input')
    .click(function(e) {
         $(this).focus();
    }
    .change(function(e) {
         var myValue = $(this);
         if (!myValue.val()) {
            // do something when cleared
         } else {
            // do something on changed date
         }
    });

HTML：

<input type="date" class="date-input" />