Массив Javascript со смесью литералов и массивов
Я могу создать следующее и ссылаться на него, используя
area[0].states[0]
area[0].cities[0]
var area = [
{
"State" : "Texas",
"Cities" : ['Austin','Dallas','San Antonio']
},
{
"State" :"Arkansas",
"Cities" : ['Little Rock','Texarkana','Hot Springs']
}
] ;
Как я мог реструктурировать «область» так, чтобы, зная название штата, я мог использовать его в ссылке для получения массива городов?
Спасибо
РЕДАКТИРОВАТЬ Пытаясь реализовать полученные ответы (спасибо @Eli Courtwright, @ 17 из 26 и @JasonBunting), я понимаю, что мой вопрос был неполным. Мне нужно пройти через «область» в первый раз, ссылаясь на «состояние» по индексу, а затем, когда я выберу «состояние», мне нужно вернуться через структуру, используя значение «состояние», чтобы получить связанный « города ». Я действительно хочу начать с приведенной выше структуры (хотя я могу построить ее так, как хочу), и я не возражаю против преобразования, аналогичного ответу @eli (хотя мне не удалось заставить это преобразование работать). В первом вопросе следовало бы быть более полным. Пытаясь реализовать 2 поля выбора, где выбор из первого заполняет второй ... Я загружу эту структуру массива в файл js при загрузке страницы.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 4
Если вы хотите создать его таким образом для начала, просто скажите
area = {
"Texas": ['Austin','Dallas','San Antonio']
}
и так далее. Если вы спрашиваете, как взять существующий объект и преобразовать его в этот, просто скажите
states = {}
for(var j=0; j<area.length; j++)
states[ area[0].State ] = area[0].Cities
После запуска приведенного выше кода вы могли бы сказать
states["Texas"]
который вернется
['Austin','Dallas','San Antonio']
var area =
{
"Texas" : { "Cities" : ['Austin','Dallas','San Antonio'] },
"Arkansas" : { "Cities" : ['Little Rock','Texarkana','Hot Springs'] }
};
Тогда вы сможете:
area["Texas"].Cities[0];
Это даст вам массив городов, основанный на знании названия штата:
var area = {
"Texas" : ["Austin","Dallas","San Antonio"],
"Arkansas" : ["Little Rock","Texarkana","Hot Springs"]
};
// area["Texas"] would return ["Austin","Dallas","San Antonio"]
(С помощью ответов я заставил это работать так, как я хотел. Я исправил синтаксис в выбранном ответе в приведенном ниже коде)
Со следующими полями выбора
<select id = "states" size = "2"></select>
<select id = "cities" size = "3"></select>
и данные в этом формате (либо в файле .js, либо полученные как JSON)
var area = [
{
"states" : "Texas",
"cities" : ['Austin','Dallas','San Antonio']
},
{
"states" :"Arkansas",
"cities" : ['Little Rock','Texarkana','Hot Springs']
}
] ;
Эти функции JQuery будут заполнять поле выбора города на основе выбора поля выбора штата.
$(function() { // create an array to be referenced by state name
state = [] ;
for(var i=0; i<area.length; i++) {
state[area[i].states] = area[i].cities ;
}
});
$(function() {
// populate states select box
var options = '' ;
for (var i = 0; i < area.length; i++) {
options += '<option value = "' + area[i].states + '">' + area[i].states + '</option>';
}
$("#states").html(options); // populate select box with array
// selecting state (change) will populate cities select box
$("#states").bind("change",
function() {
$("#cities").children().remove() ; // clear select box
var options = '' ;
for (var i = 0; i < state[this.value].length; i++) {
options += '<option value = "' + state[this.value][i] + '">' + state[this.value][i] + '</option>';
}
$("#cities").html(options); // populate select box with array
} // bind function end
); // bind end
});