Цитата:
|
Массивы начинаются с 0
|
Когда ввожу 0, то появляется первый блок
if (input.value == i) img[i].classList.remove("hidden");
Но не понятно, почему он не удаляется, если в инпуте пусто, должно же сработать условие else, а оно почему-то не работает. |
DivMan,
alert("" == 0)
|
Вот так, я полностью понимаю
<style>
.hidden {
display: none;
}
.img {
width: 200px;
height: 200px;
}
.img1 {background: green;}
.img2 {background: blue;}
.img3 {background: red;}
</style>
<input type="text" class="input">
<div class="img img1 hidden"></div>
<div class="img img2 hidden"></div>
<div class="img img3 hidden"></div>
<script>
var input = document.querySelector(".input");
var img = document.querySelectorAll(".img");
input.oninput = function() {
img.forEach(function(element, i) {
if(input.value.length == 0) {
img[i].classList.add("hidden");
return false;
}
if (input.value == i) {
img[i].classList.remove("hidden");
}
else {
img[i].classList.add("hidden");
}
})
};
</script>
|
Цитата:
|
DivMan,
для 0 ... 1 ... 2
<html>
<head>
<meta charset="utf-8">
<style>
.hidden {
display: none;
}
.img {
width: 200px;
height: 200px;
}
.img1 {background: green;}
.img2 {background: blue;}
.img3 {background: red;}
</style>
</head>
<body>
<input type="text" class="input">
<div class="img img1 hidden"></div>
<div class="img img2 hidden"></div>
<div class="img img3 hidden"></div>
<script>
var input = document.querySelector(".input");
var img = document.querySelectorAll(".img");
input.oninput = function() {
console.log(input.value);
img.forEach(function(element, i) {
if (input.value.trim() && input.value == i) img[i].classList.remove("hidden");
else img[i].classList.add("hidden")
})
};
</script>
</body>
</html>
|
То есть в поле, если всё стереть, то всё равно остаётся пробел?
|
DivMan,
не пробел, а пустая строка. |
Всё таки наверно буду использовать мой вариант, он для меня понятней
|
| Часовой пояс GMT +3, время: 01:46. |