Вопрос задан
Просмотрен
34 раза
document.getElementsByClassName("form-control")[0].addEventListener("change", function() {
document.getElementsByTagName('img')[0].style.display = 'none';
document.getElementsByTagName('img')[2].style.display = 'none';
})
<nav class='navbar navbar-default'>
<div class='container'>
<div class="navbar-header">
</div>
</div>
</nav>
<div class="container">
<div class='col-xs-12 col-sm-6 col-sm-offset-3'>
<div class='page-header'>
<h1>вибери свою систему:</h1>
<img src="tasks_assets/apple.jpg" alt="Apple">
<img src="tasks_assets/ubuntu.png" alt="Ubuntu">
<img src="tasks_assets/windows.jpg" alt="Windows">
</div>
<div class='panel'>
<div class='panel-body'>
<form>
<select class="form-control">
<option id="cio">Windows</option>
<option id="cio1">Os X</option>
<option id="cio2">Ubuntu</option>
</select>
<br>
<p>
<button class='btn btn-primary'>подтвердить</button>
</p>
</form>
</div>
</div>
</div>
</div>
задан 18 нояб. 2018 в 18:57
TarasTaras
6344 бронзовых знака
0
document.getElementsByClassName("form-control")[0].addEventListener("change", function(e) {
document.querySelectorAll(".page-header > img").forEach(item => {
if (item.getAttribute("alt") !== e.target.value) {
item.style.display = "none";
}
else {
item.style.display = "block";
}
});
});
<nav class='navbar navbar-default'>
<div class='container'>
<div class="navbar-header">
</div>
</div>
</nav>
<div class="container">
<div class='col-xs-12 col-sm-6 col-sm-offset-3'>
<div class='page-header'>
<h1>вибери свою систему:</h1>
<img src="tasks_assets/apple.jpg" alt="Apple">
<img src="tasks_assets/ubuntu.png" alt="Ubuntu">
<img src="tasks_assets/windows.jpg" alt="Windows">
</div>
<div class='panel'>
<div class='panel-body'>
<form>
<select class="form-control">
<option value="Windows">Windows</option>
<option value="Apple">Os X</option>
<option value="Ubuntu">Ubuntu</option>
</select>
<br>
<p>
<button class='btn btn-primary'>подтвердить</button>
</p>
</form>
</div>
</div>
</div>
</div>
ответ дан 18 нояб. 2018 в 19:06
Misha SaidovMisha Saidov
5,41611 золотой знак1010 серебряных знаков3131 бронзовый знак