Поиск блока по тексту заголовка (jQuery, javascript, html, css)
Есть блок карточек со строкой поиска:
<form>
<input type="text" id="searchValue" name="valueId"/>
<input type="button" id="searchBtn" />
</form>
<div class='row'>
<div class='card'>
<div class='card-title'>TitleOne</div>
</div>
<div class='card'>
<div class='card-title'>TitleTwo</div>
</div>
</div
Нужно сделать поиск по введенному слову и вывести только те блоки, у которых card-title.text() совпадает с введенным значением в input. Получаю значение input'a вот так, а потом завис. Подскажите, что дальше?
$(document).ready(function () {
$('#searchBtn').click(function () {
let text = $('.card-title').text();
let value = $('#searchValue').val();
if (text.includes(value)) { // Фильтр какой-то должен быть здесь
console.log(text)
}
});
})
Ответы (1 шт):
Автор решения: Igor
→ Ссылка
$('#searchBtn').click(function () {
let value = $('#searchValue').val();
$('.card-title').each(function() {
let card = $(this).closest('.card');
let text = $(this).text();
text.includes(value)? card.show() : card.hide();
});
});