JQuery 删除 id 不包含字符串的元素

JQuery remove elements with id not containing a string

本文关键字：字符串 元素 包含 删除 id JQuery      更新时间：2023-09-26

我正在尝试在页面上实现搜索算法。

我有一个包含订单的表，每行都有一个订单，它有一个唯一的 ID。

每行的<tr>都设置了以下 ID：

<tr class="searchable" id="bla_1">1</tr>
<tr class="searchable" id="bla_2">2</tr>
<tr class="searchable" id="notbla_3">3</tr>
<tr class="searchable" id="not_4">4</tr>
我想隐藏类可搜索的所有元素，这些

元素与搜索字符串不同。最好不要只看开头。所以在上面的例子中，如果我的搜索字符串是"bla"，它将显示第 1、2 和 3 行。

我还希望能够在其他容器上使用相同的功能，例如divs：

<div class="searchable" id="bla_1">1</div>
<div class="searchable" id="bla_2">2</div>
<div class="searchable" id="notbla_3">3</div>
<div class="searchable" id="not_4">4</div>

我假设我需要某种 foreach 循环，但到目前为止，我还没有找到如何做到这一点。

试试这个

var search="bla";
$('.searchable').hide();
$('.searchable[id*="' + search + '"]').show();

你想使用属性'contains'选择器。

$('.searchable[id*="' + searchString + '"]').show();

其中searchString是变量字符串等于您要搜索的字符串。 

var search; //holds the value
if(search == ""){
  $('.searchable').show();
}else{
  $('.searchable').hide();
  $('.searchable[id*="' + search + '"]').show();
}


// Hide all elements containing bla in the id
$('.searchable[id*="bla"]').hide();
// Hide all elements not containing bla in the id
$('.searchable:not([id*="bla"])').hide();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="searchable" id="bla_1">1</div>
<div class="searchable" id="bla_2">2</div>
<div class="searchable" id="notbla_3">3</div>
<div class="searchable" id="not_4">4</div>

相关文章：