Как показать/скрыть блок при совпадении нескольких условий?

Question

[Сергей]

Есть несколько полей ввода чисел и блок:

<input type="number" min="10" max="20" placeholder="10">
<input type="number" min="5" max="10" placeholder="5">
<input type="number" min="7" max="15" placeholder="7">
<div class="block">Hello, world!</div>

Нужно показывать блок, если хотя бы одно из них имеет значение, отличное от минимального, и скрывать блок, если все пустые или имеют минимальные значения. Вроде всё просто, но решение на ум не идёт.

Answer 1

[hzzzzl]

let hideBlock = true

document.querySelectorAll('input')
	.forEach(input => {
		// console.log(input.min, input.max, input.value)
		if (input.value && +input.value > +input.min) 
			hideBlock = false
	})
 
if (hideBlock) {
	document.querySelector('.block').style.display = 'none'
} else {
	document.querySelector('.block').style.display = 'block'
}

Comments

[Alams Stoyne]

я бы еще дополнил срабатывание на событие изменения поля

[Сергей]

Мне кажется, надо копать в сторону метода every.

[hzzzzl]

тогда уж .some , если проверять что "хотя бы один имеет значение"

const show = [...document.querySelectorAll('input')]
  .some(input => input.value && +input.value > +input.min)