Was ich jetzt habe:

Also habe ich diesen HTML5-Datalist mit einer Reihe von Optionen und ich habe 2 Ereignisse ausgelöst. Eines, wenn der Benutzer etwas eingibt, das mit dem Array von Namen übereinstimmt, das die Optionen enthält, wie z. B. "Rick Bross" oder "Jack Johnson" (keyup). Ein weiteres Ereignis, das ausgelöst wird, wenn ein Benutzer mit der Eingabe des Namens beginnt. Es wird angezeigt, der Benutzer zeigt einen Pfeil nach unten und drückt die Eingabetaste (Ändern).

Das Problem:

Ich brauche ein Ereignis, um auszulösen, wenn der Benutzer auf eine der Dropdown-Optionen klickt, BEVOR er den vollständigen Namen eingibt und bevor das Objekt unscharf wird. Wenn ein Benutzer jetzt auf eines klickt, bevor der Name vollständig eingegeben wurde, lösen die beiden Ereignisse die Funktion erst aus, wenn die Eingabe verschwommen ist.

Das Markup:

<datalist id="potentials">
    <option value="Rick Bross">  
    <option value="Jack Johnson">  
    <option value="Rick Bross">  
    <option value="Rick Bross">   
</datalist>

Javascript Ereignisse und Funktionen:

window.checkModelData = function(ele)
{
    var name = $(ele).val().replace(" ", "");
    var mod = potentialModels[name];
    if(mod) {
        loadModelData(name);
    }
}

function loadModelData(name) {
    var mod = potentialModels[name];
    $("#address").val(potentialModels[name].address);
    $("#city").val(potentialModels[name].city);
    $("#state").val(potentialModels[name].state);
    $("#email").val(potentialModels[name].email);
    $("#phone").val(potentialModels[name].phone);
    $("#zip").val(potentialModels[name].zip);
}

$("#name").keyup(function(){

    window.checkModelData(this);

});
$("#name").change(function(){

    window.checkModelData(this);
});