Изменение стиля касается только первого элемента массива - PullRequest
Новая
       35

Изменение стиля касается только первого элемента массива

0 голосов
/ 24 февраля 2020

Я устанавливаю прослушиватели событий на пару входов с forEach l oop. В событии «change» я хочу анимировать элемент родного брата в качестве индикатора выполнения.

Проблема в том, что независимо от того, какое событие Listener запускает, он всегда будет стилизовать родного брата первого элемента ввода, нет независимо от того, какой вход вызывает событие изменения.

HTML

<div>
    <input type="file" class="upload--file" id="upload--file">
    <label for="upload--file"></label>
    <img>
    <h3></h3>
    <p></p>
    <div class='BG'></div>
</div>
<div>
    <input type="file" class="upload--file" >
    <label for="upload--file"></label>
    <img>
    <h3></h3>
    <p></p>
    <div class='BG'></div>
</div>

JS

document.querySelectorAll('.upload--file').forEach(item => {

    item.addEventListener('change', () => {

        item.parentNode.childNodes[11].style.height = '100%';

    })
})

Как вы можете видеть на изображении, я нажал второй поле, но стиль применяется к div внутри первого поля. enter image description here

...