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的检测选取浏览器自动完成值的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-14 20:46