JavaScript数组是否基于下拉选择自动填充？

Question

So I have a question about a web app I'm considering making. I want to allow users to select an item from a dropdown list. For instance we'll say clothes. So they select an option from the dropdown list like: Shirt, Pants, Shoes.

From there, it will then auto-populate various input/text fields below such as prices.

Do I make one array with all of the options? Such as {'shirt', 'pants', 'shoes'}, or do I do: {'shirt', '14.99', 'red', 'tuesday'}

For instance if someone selected shirt, it would then populate the fields based on $14.99 for price, red for color, and Tuesday for date to wear.

OR do I do a different array for each individual field and just do if then statements like, "if 'shirt' === 'red', then [0]"

I'm lost on how to get started ( extremely inexperienced in JS, but figured I'd ask.)

Thanks in advance.

Answer 1

I'm writing a small piece of code to give you an idea. I found time and I also write select boxes.

 var dress, i, j, x = ""; dress = { "shirt": [ { "product_name":"women shirt", "price": 25, "colors":[ "red", "green", "yellow" ] }, { "product_name":"baby shirt", "price": 35, "colors":[ "red", "pink" ] }, { "product_name":"man shirt", "price": 15, "colors":[ "pink", "blue" ] } ] } for (i in dress.shirt) { x += "<h2>Product Name: " + dress.shirt[i].product_name +" > Price: "+ dress.shirt[i].price+"</h2>"; for (j in dress.shirt[i].colors) { x += dress.shirt[i].colors[j] + "<br>"; } } document.getElementById("demo").innerHTML = x; 

 <p id="demo"></p>