Change event not firing on text input using jquery

2019-02-21 11:59发布

站内问答 / jQuery
1826 4 4

I have a problem with a jquery change event on a text input that works as expected in Firefox and IE but not in Chrome. I also have a keyup event on the text input to manipulate the input as it is entered, but when the input is done I need to run some extra code. I tried using the 'blur' event and the 'focusout' event as someone here had suggested as a substitute, but then I couldn't change focus at all -- the input kept grabbing it back somehow. Here is the code:

 $('.textInput').keyup(function(event) { /* do stuff */ });
 $('.textInput').change(function(event) { alert('Changed!'); /* do other stuff */ });

and the html:

 <input type="text" class="textInput" value="" />

I am using jQuery 1.6.3. Any suggestions would be greatly appreciated. H.

4条回答
Rolldiameter
2楼-- · 2019-02-21 12:18

You can use the input event that works like a charm:

$('#search-form .term').bind('input', function(){
  console.log('this actually works');
});

Source: https://gist.github.com/brandonaaskov/1596867

查看更多
0人赞 添加讨论(0) 举报
一纸荒年 Trace。
3楼-- · 2019-02-21 12:24

Actually, there's a bug on Google Chrome that causes the 'change' event to not fire if something has been changed by the 'keyup' event:

https://code.google.com/p/chromium/issues/detail?id=92492

The issue seems to be open since May 2, 2013.

查看更多
0人赞 添加讨论(0) 举报
Juvenile、少年°
4楼-- · 2019-02-21 12:26

The change event will not fire unless the input focus switched to other controls

查看更多
0人赞 添加讨论(0) 举报
Juvenile、少年°
5楼-- · 2019-02-21 12:35 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('.textInput').keyup(function (event) {
                var obj = $(this);
                if ((event.keyCode ? event.keyCode : event.which) === 13) {
                    $('#result').text('Enter has been triggered.');
                }
            }); ;

            $('.textInput').change(function (event) {
                var obj = $(this);
                $('#result').text('Input text has been changed:' + obj.val());
            }); ;
        });
    </script>
</head>
<body>
    <span id="result"></span>
    <br />
    Enter some text and press enter:
    <input type="text" class="textInput" value="" />
</body>
</html>
查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(4)