自动完成时触发的任何事件？

Question

我有一个非常简单的形式.当用户键入输入字段时,我想更新他们在页面上其他位置键入的内容.一切正常.我已经绑定的更新的keyup,change和click事件.

唯一的问题是如果您从浏览器的自动完成框中选择一个输入,它就不会更新.从自动完成中选择时是否会触发任何事件(显然既不是change也不是click).请注意,如果您从自动完成框中选择并模糊输入字段,则会触发更新.我希望它能在自动完成后立即触发.

请参阅:http://jsfiddle.net/pYKKp/(希望您过去使用名为"email"的输入填写了很多表单).

HTML:

<input name="email" /> 
<div id="whatever">&lt;whatever></div> 

CSS:

div { 
    float: right; 
} 

脚本:

$("input").on('keyup change click', function () { 
   var v = $(this).val(); 
    if (v) { 
     $("#whatever").text(v);   
    }  
    else { 
        $("#whatever").text('<whatever>'); 
    } 
}); 

Answer 1

我推荐使用monitorEvents.它是由web检查器和firebug中的javascript控制台提供的函数,它打印出元素生成的所有事件.以下是您如何使用它的示例:

monitorEvents($("input")[0]);

在您的情况下,input当用户从自动完成下拉菜单中选择一个项目时,Firefox和Opera都会生成一个事件.在IE7-8中change,在用户更改焦点后生成事件.最新的Chrome确实会产生类似的事件.

可以在此处找到详细的浏览器兼容性图表:https:
//developer.mozilla.org/en-US/docs/Web/Events/input

Answer 2

这是一个很棒的解决方案.

$('html').bind('input', function() {
    alert('test');
});

我使用Chrome和Firefox进行了测试,它也适用于其他浏览器.

我尝试了许多具有许多元素的事件,但只有当您从自动完成中选择时才触发此事件.

希望它能节省一些时间.

Answer 3

添加“模糊”。适用于所有浏览器！

$("input").on('blur keyup change click', function () {