Gibt es ein Ereignis, das bei der automatischen Vervollständigung ausgelöst wird?

Ich habe eine ziemlich einfache Form. Wenn der Benutzer ein Eingabefeld eingibt, möchte ich aktualisieren, was er an einer anderen Stelle auf der Seite eingegeben hat. Das alles funktioniert gut. Ich habe das Update auf die gebunden keyup, changeund clickVeranstaltungen.

Das einzige Problem besteht darin, dass eine Eingabe aus dem Feld für die automatische Vervollständigung des Browsers nicht aktualisiert wird. Gibt es ein Ereignis, das ausgelöst wird, wenn Sie die automatische Vervollständigung auswählen (anscheinend weder changenoch click). Beachten Sie , dass die Aktualisierung ausgelöst wird , wenn Sie aus dem Feld für die automatische Vervollständigung auswählen und das Eingabefeld verwischen . Ich möchte, dass es ausgelöst wird, sobald die automatische Vervollständigung erfolgt.

Siehe: http://jsfiddle.net/pYKKp/ (hoffentlich haben Sie in der Vergangenheit viele Formulare mit einer Eingabe namens "E-Mail" ausgefüllt).

HTML:

<input name="email" /> 
<div id="whatever">&lt;whatever></div> 

CSS:

div { 
    float: right; 
} 

Skript:

$("input").on('keyup change click', function () { 
   var v = $(this).val(); 
    if (v) { 
     $("#whatever").text(v);   
    }  
    else { 
        $("#whatever").text('<whatever>'); 
    } 
}); 

Ich empfehle die Verwendung monitorEvents. Es ist eine Funktion , die durch die JavaScript - Konsole in beide bieten Web - Inspektor und Firebug , dass druckt alle Ereignisse , die von einem Element erzeugt werden. Hier ist ein Beispiel, wie Sie es verwenden würden:

monitorEvents($("input")[0]);

In Ihrem Fall generieren sowohl Firefox als auch Opera ein inputEreignis, wenn der Benutzer ein Element aus der Dropdown-Liste für die automatische Vervollständigung auswählt. In IE7-8 wird ein changeEreignis erzeugt, nachdem der Benutzer den Fokus geändert hat. Das neueste Chrome generiert ein ähnliches Ereignis.

Eine detaillierte Tabelle zur Browserkompatibilität finden Sie hier:
https://developer.mozilla.org/en-US/docs/Web/Events/input

Hier ist eine großartige Lösung.

$('html').bind('input', function() {
    alert('test');
});

Ich habe mit Chrome und Firefox getestet und es wird auch für andere Browser funktionieren.

Ich habe viele Ereignisse mit vielen Elementen ausprobiert, aber nur dies wird ausgelöst, wenn Sie die automatische Vervollständigung auswählen.

Hoffe, es wird jemandem Zeit sparen.

Fügen Sie "Unschärfe" hinzu. funktioniert in allen Browsern!

$("input").on('blur keyup change click', function () {

Wie Xavi erklärte, gibt es dafür keine 100% Cross-Browser-Lösung, deshalb habe ich selbst einen Trick dafür erstellt (5 Schritte, um fortzufahren):
1. Ich benötige ein paar neue Arrays:

window.timeouts     = new Array();
window.memo_values  = new Array();

2. Wenn ich mich auf den Eingabetext konzentriere, den ich auslösen möchte (in Ihrem Fall "E-Mail", in meinem Beispiel "Name"), lege ich ein Intervall fest, zum Beispiel mit jQuery (nicht benötigte Gedanken):

jQuery('#name').focus(function ()
{
    var id = jQuery(this).attr('id');
    window.timeouts[id] = setInterval('onChangeValue.call(document.getElementById("'+ id +'"), doSomething)', 500);
});

3. Bei Unschärfe entferne ich das Intervall: (immer mit jQuery nicht benötigt) und überprüfe, ob sich der Wert geändert hat

jQuery('#name').blur(function ()
{
    var id = jQuery(this).attr('id');
    onChangeValue.call(document.getElementById(id), doSomething);
    clearInterval(window.timeouts[id]);
    delete window.timeouts[id];
});

4. Nun ist die Hauptfunktion, die Änderungen überprüft, die folgende

function onChangeValue(callback)
{
    if (window.memo_values[this.id] != this.value)
    {
        window.memo_values[this.id] = this.value;

        if (callback instanceof Function)
        {
            callback.call(this);
        }
        else
        {
            eval( callback );
        }
    }
}

Wichtiger Hinweis: Sie können "this" in der obigen Funktion verwenden und auf Ihr ausgelöstes HTML-Eingabeelement verweisen. Damit diese Funktion funktioniert, muss eine ID angegeben werden. Sie können eine Funktion, einen Funktionsnamen oder eine Befehlszeichenfolge als Rückruf übergeben.

5. Schließlich können Sie etwas tun, wenn der Eingabewert geändert wird, auch wenn ein Wert aus einer Dropdown-Liste für die automatische Vervollständigung ausgewählt wird

function doSomething()
{
    alert('got you! '+this.value);
}

Wichtiger Hinweis: Wieder verwenden Sie "this" in der obigen Funktion, die sich auf das ausgelöste HTML-Eingabeelement bezieht.

FIDDLE ARBEITEN !!!
Ich weiß, es klingt kompliziert, ist es aber nicht.
Ich habe eine funktionierende Geige für Sie vorbereitet. Die zu ändernde Eingabe heißt "Name". Wenn Sie also jemals Ihren Namen in ein Online-Formular eingegeben haben, müssen Sie möglicherweise eine Dropdown-Liste zur automatischen Vervollständigung Ihres Browsers testen.

Erkennen der automatischen Vervollständigung bei Formulareingaben mit jQuery ODER JAVASCRIPT

Mit: Ereigniseingang . Auswahl von Wertvorschlägen (Eingabe oder Textbereich)

ZB FÜR JQUERY: ZB:

$(input).on('input', function() { 
alert("Number selected ");

});

Zum Beispiel für JAVASCRIPT:

<input type="text"  onInput="affiche(document.getElementById('something').text)" name="Somthing" />

Diese Ajax-Abfrage starten ...

Der einzig sichere Weg ist die Verwendung eines Intervalls.

Lucas Antwort ist zu kompliziert für mich, deshalb habe ich meine eigene Kurzversion erstellt, die hoffentlich jemandem helfen wird (vielleicht sogar mir aus der Zukunft):

    $input.on( 'focus', function(){
        var intervalDuration = 1000, // ms
            interval = setInterval( function(){

                // do your tests here
                // ..................

                // when element loses focus, we stop checking:
                if( ! $input.is( ':focus' ) ) clearInterval( interval );  

            }, intervalDuration );
    } );

Getestet auf Chrome, Mozilla und sogar IE.

Ich habe dadurch festgestellt, monitorEventsdass zumindest in Chrome das keyupEreignis vor dem Autocomplete- inputEreignis ausgelöst wird . Bei einer normalen Tastatureingabe ist die Reihenfolge keydown input keyupalso nach der Eingabe.

Was ich getan habe ist dann:

let myFun = ()=>{ ..do Something };

input.addEventListener('change', myFun );

//fallback in case change is not fired on autocomplete
let _k = null;
input.addEventListener( 'keydown', (e)=>_k=e.type );
input.addEventListener( 'keyup', (e)=>_k=e.type );
input.addEventListener( 'input', (e)=>{ if(_k === 'keyup') myFun();})

Muss mit einem anderen Browser überprüft werden, aber das kann ein Weg ohne Intervalle sein.

Ich glaube nicht, dass Sie dafür ein Ereignis benötigen: Dies geschieht nur einmal, und es gibt keine gute browserweite Unterstützung dafür, wie die Antwort von @xavi zeigt.

Fügen Sie einfach eine Funktion hinzu, nachdem Sie den Body geladen haben, der die Felder einmal auf Änderungen des Standardwerts überprüft. Wenn Sie nur einen bestimmten Wert an eine andere Stelle kopieren möchten, kopieren Sie ihn einfach, um sicherzustellen, dass er ordnungsgemäß initialisiert wurde.