All geek questions in one place

What event is fired? (javascript, input-field-history)

I have a text box that is empty, but when you click on it, it has suggestions from previous inputs.

What JavaScript event will be fired if I select one of them with the mouse?

I am using jquery 1.6.2 to bind listeners:

view.textRegistrations.bind("blur change keyup", function(event) { //do Something });
+4
source share
3 answers

the oninput event is fired.

to 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>

difference between oninput, onpropertychange, onchange:

onchange only starts when

a) property changed using the user interface

b), and the element has lost focus

onpropertychange is triggered when a property changes. but it is only IE

oninput

oninput is a version of W3C onpropertychange. IE9 begins to carry this event.

oninput only starts when the value of an element changes.

so if you want flexibility in all browsers

IE <9 uses onpropertychange

IE> 9 and other use of broweser oninput

if you use jQuery you can bind two events that use 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

+4
source

An incredibly useful tool to help you solve your problem, Visual Event 2 . Basically, for any element on your screen, it will tell you what Javascript it registered for this element for.

This is a bookmarklet, so what you do, drag it to the bookmarks bar, go to the page you are interested in and click the link then. Presto! Details of registered Javascript events.

As @smerny said, there is a good chance that it’s not even Javascript, but just a built-in browser function. With this, you can probably easily implement your version.

+1
source

An input event reports a change (I'm testing using Google Chrome v28), demo

 document.getElementsByTagName('input')[0].oninput = function (e) { console.log('input', e); };

But at the same time, monitorEvents from the console does not report any event when this happens

 monitorEvents(document.getElementsByTagName('input')[0]);

Apply in the console on this page , for example

0
source

Source: https://habr.com/ru/post/1492325/

More articles:


All Articles