1

次の JSON オブジェクトがあり、値を使用してドロップダウンに入力したいと考えています。私はこれを 2 日間機能させようとしてきましたが、コンピューターを窓から放り出す準備ができています。誰か助けてくれませんか?!

これがJSONオブジェクトです...

{
"query":"de mar",
"suggestions":[
    "Any Location",
    "Camp De Mar, Majorca, SPAIN",
    "L'amettla De Mar, Costa Dorada, SPAIN",
    "Lloret De Mar, Costa Brava, SPAIN",
    "Malgrat De Mar, Costa Brava, SPAIN",
    "Pineda De Mar, Costa Brava, SPAIN",
    "Roquetas De Mar, Costa De Almeria, SPAIN",
    "Tossa De Mar, Costa Brava, SPAIN"
],
"data":[
    "",
    "DestinationResort|Camp De Mar",
    "DestinationResort|L'Amettla De Mar",
    "DestinationResort|Lloret De Mar",
    "DestinationResort|Malgrat De Mar",
    "DestinationResort|Pineda De Mar",
    "DestinationResort|Roquetas De Mar",
    "DestinationResort|Tossa De Mar"
]
}

そして私のhtmlとjavascript...

<input type="text" id="search" data-provide="typeahead">

<select name="destinations" id="destinations"></select>

$("#search").on("input", function() {
$.getJSON( "http://holidays.allinclusive.co.uk/external/destinations.ashx?query=" + $("#search").val() )
.done(function(data) {
$.each(data, function() {
  $.each(this, function(name, value) {
    $( '<option value="' + data.value +'">' + value + '</option>' ).appendTo( "#destinations" );
  })
})
})
});

最終的にはこんなものを探すのですが…

<option value="DestinationResort|Camp De Mar">Camp De Mar, Majorca, SPAIN</option>

誰か私の不幸を終わらせてくれませんか?

ありがとう

4

3 に答える 3

1

理想的には、JSON を再フォーマットして、データ値と対応するテキストが 2 つの個別の配列ではなくグループ化されるようにすることができますが、配列が同じインデックスを持つことが保証されている限り、一方をループして、もう一方の対応するインデックスを取得できます。 .

$.each(data.suggestions, function (idx, elem) {
    $("select").append(
        $("<option>").val(data.data[idx]).text(elem)
    );
});

http://jsfiddle.net/ExplosionPIlls/BwxtR/

于 2013-06-11T10:45:22.677 に答える
0

両方のプロパティが配列を指しており、配列データがインデックスと一致していることがわかります。したがって、次のようなもので十分です。

var option = '<option value="' + data.data[index] + '">" + data.suggestions[index] + "</option>";

あなたのコードを取る：

$("#search").on("input", function() {
    $.getJSON( "http://holidays.allinclusive.co.uk/external/destinations.ashx?query=" + $("#search").val() )
        .done(function(data) {
            for (var index = 0; index < data.data.length; index++) {
                var option = '<option value="' + data.data[index] + '">" + data.suggestions[index] + "</option>";
            }
        })
    });
});
于 2013-06-11T10:44:14.563 に答える
0

これを試して、

var json={"query":"de mar","suggestions":[    "Any Location",    "Camp De Mar, Majorca, SPAIN",    "L'amettla De Mar, Costa Dorada, SPAIN",    "Lloret De Mar, Costa Brava, SPAIN",    "Malgrat De Mar, Costa Brava, SPAIN",    "Pineda De Mar, Costa Brava, SPAIN",    "Roquetas De Mar, Costa De Almeria, SPAIN",    "Tossa De Mar, Costa Brava, SPAIN"],"data":[    "",    "DestinationResort|Camp De Mar",    "DestinationResort|L'Amettla De Mar",    "DestinationResort|Lloret De Mar",    "DestinationResort|Malgrat De Mar",    "DestinationResort|Pineda De Mar",    "DestinationResort|Roquetas De Mar",   "DestinationResort|Tossa De Mar"]};


$.each(json.suggestions, function(index,value) {
    $( '<option value="'+json.data[index]+'">'+value+'</option>').appendTo("#destinations" );
});

フィドル http://jsfiddle.net/DbVUa/

于 2013-06-11T10:46:37.683 に答える