dimanche 18 août 2019

How to create if loops using values from two different sets

there. I'm super new to coding, and I'm trying to understand how to organize my code. I have two select elements in my html, that i would like to call separately, but i don't know how to appropriately go about it. I would like to call the two different events so that when each one is selected individually, it pulls data from its individual set of option values.

From there, I will use the results to build loops that will then give concatenated results in a third string.

var select = document.getElementById('weather');
var para = document.getElementById('alf');

select.addEventListener('change', setWeather);

function setWeather() {
var choice = select.value;

if (choice === 'sunny') {
  para.textContent = 'Suns out, guns out.';
} else if (choice === 'rainy'){
  para.textContent = 'Moons out, boons out';
} else if (choice === 'snowy') {
  para.textContent = 'Look, a whale!';
} else {
  para.textContent = '';
}
}

So i realize that the above code works for the first instance of select="weather", but i'm not sure how to go about calling the second instance, so that it also receives a call.

<label for="weather">Select weather</label>
<select id="weather">
   <option value="">--make a choice--</option>
   <option value="sunny">Sunny</option>
   <option value="rainy">Rainy</option>
   <option value="snowy">Snowy<option>
</select>

<p id="alf"></p>

<label for="">Select weather</label>
<select id="dance">
   <option value="">--make a choice--</option>
   <option value="hail">Sunny</option>
   <option value="rail">Rainy</option>
   <option value="cat">Snowy<option>
</select>

ideally, I'd like be able to call information from 'select id="weather" and select id="dance", separately, and at the same time. Any news would be good news. Thanks!

Aucun commentaire:

Enregistrer un commentaire