Stellen Sie sich eine JSON-Datei mit den folgenden Daten vor:

[
    {
        color: "red",
        value: "#f00"
    },
    {
        color: "green",
        value: "#0f0"
    },
    {
        color: "blue",
        value: "#00f"
    },
    {
        color: "cyan",
        value: "#0ff"
    }
]

Mit der Autocomplete-Methode von jQuery soll es in der Lage sein, das anzuzeigenFarbe als Optionen zum Auswählen und EinfügenWert auf einen Eingang.

<input type="text" name="selector" id="selector" />

<input type="text" name="color" id="color" />
<input type="text" name="value" id="value" />

Das oben Genannte erfordert keine Einführung. Selektor für die Suche nach den Farben,input.color mitFarbe Wert undinput.value mitWert Wert.

BEARBEITEN: Ich habe diese JSON-Daten:

[{
    "label": "Sec\u00e7\u00e3o 1",
    "value": "1"
}, {
    "label": "Sec\u00e7\u00e3o 2",
    "value": "2"
}, {
    "label": "Sec\u00e7\u00e3o 3",
    "value": "3"
}, {
    "label": "Sec\u00e7\u00e3o 4",
    "value": "4"
}]

und dieses HTML:

<input type="text" id="name" />
<input type="text" id="value" />

und diese jQuery:

$(document).ready(function(){
    $("#name").autocomplete({
        source: "json.php",
        select: function (event, ui) {
            $("#name").val(ui.label);
            $("#value").val(ui.value);
        }
    });
});

Ich folgte Andrews Antwort und es fordert mich auf, die Daten auszuwählen, aber wenn ich alarmiereui.labelundui.value Variablen, heißt es "undefiniert". Was vermisse ich?

Edit2: Angenommen, ich habe diesen HTML-Code:

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

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

Ist es möglich, mehrere Selektoren mit dem gleichen zu behandeln.autocomplete() Methode? Wählen Sie mit den Tasten das gewünschte Etikett ausinput.name und aktualisieren Sie nur dieinput.value Daneben?

[eingabename] [eingabewert]
^ Ich wähle ^ aktualisiert die
ein Label-Wert daneben
[eingabename] [eingabewert]
^ das bleibt intakt ^