javascript - 在 IE 中检测 texbox clear-event。单击特定于 IE 的清除框时，如何清除 IE（Internet Explorer）中的输入类型 =“文本”（文本框）？

Question

在 Internet Explorer 中，当您开始在文本框中输入内容时，会显示一个类似 x 的小按钮。单击此图标时如何检测事件？有事件类型吗？

<input type="text" value ="" id ="qsearch" name="qsearch"
    onBlur="qsearchLookup(this.value);" OnClick="qsearchLookup(this.value);"
    onkeyup="qsearchLookup(this.value)"  size="26">

function qsearchLookup(searchVal){
    document.getElementById("qsearch").value="";
}

Answer 1

我不知道这个类似 x 的小按钮的特殊事件，我认为它不存在，但你可以使用输入事件（oninput="qsearchLookup(this.value)"在你的情况下）来捕捉这个变化。

Answer 2

我不确定，如果仍然有人在寻找解决方案。不幸的是，没有可用于clear(X) 图标的事件处理程序，但是下面的代码片段/技巧对我有用。CSS完成隐藏清除（X）图标，如果您不想隐藏清除（X）图标但需要处理，那么JS代码片段会有所帮助。在IE 8,9,10,11中验证并且它工作正常

CSS技巧：

#textFieldId::-ms-clear {display: none;}-- 对于特定的文本字段

或者

input[type=text]::-ms-clear { display: none; }-- 适用于范围内的所有文本字段

或者

JavaScript 技巧（将文本字段值重置为空/空白并触发 html 事件 KeyUp。因此，您可以根据需要进行更改）

$('#textFieldId').bind("mouseup", function() {
        var $input = $(this);
        var oldValue = $input.val();
        if (oldValue == "") {
            return;
        }
        setTimeout(function() {
            var newValue = $input.val();
            if (newValue == "") {
                $input.trigger("keyup");
            }
        }, 1);
    });

Answer 3

这对我来说效果很好:)

$input.addEventListener('mouseup', function(){
    setTimeout(function(){
        if ($input.value === '') do_stuff();
    }, 1)
});

$input作为输入元素的引用。

Answer 4

input.on('input propertychange',function(e){})

这适用于 ie10（输入）和 ie8（属性更改），但不适用于 ie9

我实际上用 mousedown 事件为 ie9 修复了它，不是很漂亮，但是那和 mouseup 是唯一触发它的事件