+1 vote
by
<div class="table-item" id="4">Выделить блок если id 4</div>
<div class="table-item" id="5">Не выделять блок</div>
<textarea id="search" type="number" value=""></textarea>
$('#search').on('input', function(){ // При вводе текста..
$('.table-item.-active').removeClass('-active'); // убираем класс .-active у .block.-active
if($('.table-item[id="'+$(this).val()+'"]').length > 0) { // проверяем если такой блок с таким id, если есть..
$('.table-item[id="'+$(this).val()+'"]') // берём блок у которого есть совпадение по id
.addClass('-active'); // выдаём ему класс .-active
}
});
by
And if the example is all highlighted then add a class like All-check
by
Sergey Sokolov ideally like this -
1221,
1123,
23123,
by
how do you want to handle the id? If the field is "1" - highlight everything where the id has 1 in it: 1, 10, 11?
How do you want to enter more than one id: with a space, comma ?

1 Answer

+1 vote
by
Here's a snippet to get you started
you're on your own.

id separated by a space or comma.
$('#search').on('input', function(){ // При вводе текста..
$('.table-item.-active').removeClass('-active'); // убираем класс .-active у .block.-active
const ids = $(this).val().split(/[ ,]/).filter(el => el.length);
for (let id of ids) {
$(`.table-item[id="${id}"]`) // берём блок у которого есть совпадение по id
.addClass('-active'); // выдаём ему класс .-active
}
});
by
Code-NaN one option is to keep the data separate from the markup, this is "correct". Create an object where keys are all possible id's and values are true or false, depending on the selection. When input event, update not only the presence-absence of classes, but also those truefalse in the object. At the end see if everything is true:
if (!Object.values(all_ids).some(el => el === false)) {
// у всех true
}
Another, crutchy g-coder option is to count classes in jQuery. Take all .table-item, check in the loop if there is a class .-active, if at least one does not, you can not check further. Checked all, all have a .-active, you can show the block.
by
And how do you check if all blocks have a class, then show hide the block?
I can't check through each
...