Tengo el siguiente código :
$(document).on("change", "[data-name=country] select", function () { var country = $("[data-name=country] select").val(); if (country != "") { $("[data-name=capital] input").val(country); } });Por supuesto, este código agrega el nombre del país al campo "capital". Me gustaría crear una matriz donde indicaría la ciudad capital de cada país, de modo que la capital se agregue al campo en lugar del país.
Sé que esta es una pregunta básica, no tendría ningún problema para hacer eso con PHP con una matriz, pero recién estoy comenzando con javascript y no puedo encontrar la sintaxis correcta.
Muchos gracias !
Puede declarar un objeto global y usarlo de manera similar a una matriz asociativa de php como esta:
let countries = { 'Country1': 'Capital1', 'Country2': 'Capital2' }; let countryName = 'Country1'; console.log(countries[countryName]);EDITAR:
Según su ejemplo, primero debe declarar el objeto de los países globalmente (fuera de su función lista para documentos) para que sea accesible desde cualquier lugar, incluso dentro de su función. Luego, dado que tiene el país, debe intentar obtener el capital del objeto. Por último, debe verificar si la variable capital contiene un valor verdadero (no ser, nulo, vacío, indefinido, etc.), en caso de que proporcione un país que no haya registrado y proceda a pasarlo a su elemento.
let countries = { 'Country1': 'Capital1', 'Country2': 'Capital2' }; $(document).on("change", "[data-name=country] select", function () { let country = $("[data-name=country] select").val(); let capital = countries[country]; if (capital) { $("[data-name=capital] input").val(capital); } });Aquí hay un ejemplo práctico de lo que creo que estás describiendo. Observe cómo puede tomar el valor de la 'matriz asociativa' para el país elegido:
countries[$(this).val()] let countries = { 'Australia': 'Canberra', 'Switzerland': 'Bern' }; $(document).ready(function() { for (let x in countries) $('select[name=countries]').append(`<option value='${x}'>${x}</option>`); $('form[data-name=country]').on("change", "select[name=countries]", function() { if ($(this).val()) $('.cap span').text(countries[$(this).val()]) }); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <form data-name='country'> <select name='countries'><option></option></select> <hr> <div class='cap'>Capital: <span></span></div> </form>