JavaScript的检测选取浏览器自动完成值 | JavaScript的检测选取浏览器自动完成值

本文介绍了JavaScript的检测选取浏览器自动完成值的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我的onkeyup 事件与文本字段。但是，当我选择一个浏览器自动完成值此事件不会被解雇。我已经添加了一个onclick事件，但它不工作。

I have a text field with an onkeyup event. But this event is not fired when I select a browser autoComplete value. I have added an onclick event, but it doesn't work.

我已经测试计算器上发布追赶浏览autocoComplete选择许多解决方案，但没有解决了这个问题。

I have tested many solutions posted on stackoverflow for catching the browse autocoComplete selection, but nothing has resolved this problem.

试试这个简单的例子来看看这个问题（转载于火狐3.6，Chrome的10.0和IE8）：

Try this simple example to see the issue (reproduced on Firefox 3.6, Chrome 10.0 and IE8):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <title>Test</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1.min.js"></script>
    <script type="text/javascript">
    //<![CDATA[
        function onkeyupInput(){
            $('#divResult').text($('#myInput').val());
        }
    //]]>
    </script>
</head>
<body>
    <form name="myForm" action="#">
        Tape a value and send it. Then select this value with your browser AutoComplete value :<br />
        <input id="myInput" name="myInput" type="text" onkeyup="onkeyupInput();" onclick="onkeyupInput();" value="" />
        <input type="submit" />
    </form>
    Result of onkeypress and onclick :
    <div id="divResult"></div>
    <br />
    <b>The issue : Result of onkeypress and onclick is not update when an autocomplete value of a browser is selected.</b>
</body>
</html>

谢谢！

`推荐答案`

较新的浏览器都支持oninput事件：

Newer browsers support the oninput event:

$(function () {
  $('#myInput').on("input",function() {
    $('#divResult').text($(this).val());
  });
});

<input id="myInput" name="myInput" type="text" value="" />

如果您需要支持旧的浏览器，尝试

If you need to support older browsers, try

var tId = "";
function monitor() {
 $('#divResult').text($('#myInput').val());
}

$(function () {
  $('#myInput')
  .focus(function() {
      tId=setInterval(monitor,100);
  })
  .blur(function() {
      clearInterval(tId);
  });
});

                        这篇关于JavaScript的检测选取浏览器自动完成值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！