Форум

nikto93i7 · #1 (**permalink**) 12.07.2015, 18:13

Здравствуйте, помогите пожалуйста разобрать с такой задачей... Не могу сообразить как сделать.

есть вот такая форма на сайте

<div class="value">
<select id="country_select" class="option_style">
<option value=1 selected>United States</option>
<option value=2>United Kingdom</option>
<option value=3>Germany</option>
<option value=4>France</option>
<option value=5>Italy</option>
<option value=6>Russia</option>
<option value=7>India</option>
<option value=8>China</option>
</select>
</div>
<h3>Country</h3>
<div class="div1">
<input id="disel_price" class="input_style" name="disel" type="text" value="0" disabled>
</div>
<h4>Disel Price ($/l)</h4>
<div class="div1">
<input id="electricity_price" class="input_style" name="electricity" type="text" value="0" disabled>
</div>
<h4>Electricity Price ($/kWh)</h4>
<div class="div1">
<input id="one_time_subsidy" class="input_style" name="onetime" type="text" value="0" disabled>
</div>
<h4>One Time Subsidy ($)</h4>
<div class="div1">
<input id="one_time_subsidy" class="input_style" name="annual" type="text" value="0" disabled>
</div>
<h4>Annual Subsidy ($)</h4>

и есть массив с данными для нее

var diselPrice = [0.78,1.76,1.32,1.34,1.61,0.56,0.86,0.95];
var electricityPrice = [0.08,0.2,0.1349,0.0941,0.1449,0.09,0.1,0.09];
var oneTimeSubsidy = [5000,6000,5500,5300,6400,6500,3800,6200];
var annualSubsidy = [500,600,0,550,0,750,630,730];

в select находятся 8 стран и они соответствуют порядку значений в массиве.

а вот теперь то что сделать не получается...
как сделать так, чтоб при выборе страны ее соответствующие значения из массива подставлялись в value (Disel Price ($/l); Electricity Price ($/kWh); One Time Subsidy ($); Annual Subsidy ($))?

буду оооочень благодарен за помощь!!)))

рони · #2 (**permalink**) 12.07.2015, 18:34

nikto93i7,

... может хоть немного учебник почитать?

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
</head>

<body>
<div class="value">
<select id="country_select" class="option_style" >
<option value=1 selected>United States</option>
<option value=2>United Kingdom</option>
<option value=3>Germany</option>
<option value=4>France</option>
<option value=5>Italy</option>
<option value=6>Russia</option>
<option value=7>India</option>
<option value=8>China</option>
</select>
</div>
<h3>Country</h3>
<div class="div1">
<input id="disel_price" class="input_style" name="disel" type="text" value="0" disabled>
</div>
<h4>Disel Price ($/l)</h4>
<div class="div1">
<input id="electricity_price" class="input_style" name="electricity" type="text" value="0" disabled>
</div>
<h4>Electricity Price ($/kWh)</h4>
<div class="div1">
<input id="one_time_subsidy" class="input_style" name="onetime" type="text" value="0" disabled>
</div>
<h4>One Time Subsidy ($)</h4>
<div class="div1">
<input id="one_time_subsidy" class="input_style" name="annual" type="text" value="0" disabled>
</div>
<h4>Annual Subsidy ($)</h4>
<script>
var diselPrice = [0.78, 1.76, 1.32, 1.34, 1.61, 0.56, 0.86, 0.95];
var electricityPrice = [0.08, 0.2, 0.1349, 0.0941, 0.1449, 0.09, 0.1, 0.09];
var oneTimeSubsidy = [5000, 6000, 5500, 5300, 6400, 6500, 3800, 6200];
var annualSubsidy = [500, 600, 0, 550, 0, 750, 630, 730];
var select = document.querySelector("#country_select"),
    inputs = document.querySelectorAll(".div1 input"),
    price = [diselPrice, electricityPrice, oneTimeSubsidy, annualSubsidy];
select.onchange = function() {
    var k = this.value - 1;
    for (var i = 0; i < inputs.length; i++) {
        inputs[i].value = price[i][k]
    }
}
select.onchange()
</script>
</body>

</html>

nikto93i7 · #3 (**permalink**) 12.07.2015, 18:40

Большое спасибо))
P.s. я читаю.. только месяц js учу

Форум

Справочник

Discord чат

Курсы javascript