Which Event is fired? (javascript, input-field-history)

后端未结

关注

 3  2017

攒了一身酷

I have a text field which is empty, but when you click in it it has some suggestions from previous inputs.

Which JavaScript event is fired if i choose one of them wi

相关标签:

3条回答

北恋

2021-01-19 17:58
The input event reports a change (I'm testing with Google Chrome v28), demo
```
document.getElementsByTagName('input')[0].oninput = function (e) {
    console.log('input', e);
};
```
But at the same time, monitorEvents from console doesn't report any event when it happens
```
monitorEvents(document.getElementsByTagName('input')[0]);
```
Apply in console on this page for example
0 讨论(0)
发布评论:

提交评论
- 加载中...

心在旅途

2021-01-19 18:02

the oninput event triggered.

try:

    <!doctype html>
    <html>
        <head>
            <meta charset="utf-8">
            <title>title</title>
        </head>
        <body>
            <form method="get" id="" action="">
                <input type="text" name="name" oninput="alert('oninput')"/>
                <input type="submit" value="done"/>
            </form>
        </body>
    </html>

the diffrence between oninput,onpropertychange,onchange:

onchange fired only when

a）the property changed by user interface

b）and the element lost focus

onpropertychange fires when property change. but it is IE only

oninput

oninput is the W3C version of onpropertychange . IE9 begin surport this event .

oninput fired only when the element value changes.

so if you want compacity in all browsers

IE<9 use onpropertychange

IE>9 and other broweser use oninput

if you use jQuery , you can bind two event that share the same hander

$(function($) {
  //the same handler
  function oninput(e){
    //do sth
  }

  $("#ipt").on("input", function(e){
    console.log("trigger by oninput");
    oninput(e);
  })

  $("#ipt").on("propertychange", function(e) {
    console.log("trigger by propertychange");
    oninput(e);
  })
})

demo at http://output.jsbin.com/salekaconi

0 讨论(0)

盖世英雄少女心

2021-01-19 18:22

An incredibly useful tool that should help you solve your problem is Visual Event 2. Basically, for any element on your screen, it will tell you which Javascript evenets that element is registered for.

It's a bookmarklet, so what you do is drag this the to your bookmarks bar, navigate to the page you're curious about, and then click then link. Presto! Detailed information about the currently registered Javascript events.

As @smerny said, there's a good chance that's not even Javascript, and is just native browser functionality. That being said, you could probably implement your own version pretty easily.

0 讨论(0)
发布评论:

提交评论
- 加载中...