我可以过滤表行内容但忽略一个元素吗?

Question

我想在每个中过滤这个表的行，除了里面的内容。这可能吗?

在这个脚本中，如果我搜索"John"，我希望只返回包含[e-mail]的行。我想忽略包含"john">的。

我似乎不能使它工作。

$(document).ready(function() {
$("#myInput").on("keyup", function() {
var value = $(this).val().toLowerCase();
$("#myTable tr").filter(function() {
$(this).toggle($(this).not('.demolist').text().toLowerCase().indexOf(value) > -1)
});
});
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="myInput" type="text" placeholder="Search..">
<table>
<thead>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Email</th>
</tr>
</thead>
<tbody id="myTable">
<tr>
<td>John</td>
<td>Doe</td>
<td>[e-mail]</td>
</tr>
<tr>
<td>Mary</td>
<td>Moe</td>
<td>[e-mail]
<div class='demolist'>john</div>
</td>
</tr>
</table>

Answer 1

也许有另一种方法，但我得到了使用函数$(this).detach()的div类"拆除"从DOM中删除，那么搜索就不会到达那里。但要把它放到DOM中，你必须告诉它在哪里(通过id或类)，所以我在"拆除者"one_answers"拆除者"之间创建了另一个DIV被称为"append"使用$(this).append(elem[index])函数。我使用jQuery分别列出类中的所有元素。这样的:

HTML

<input id="myInput" type="text" placeholder="Search..">

<table>
<thead>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Email</th>
</tr>
</thead>
<tbody id="myTable">
<tr>
<td>John</td>
<td>Doe</td>
<td>[e-mail]<div class="append">    
<div class='demolist'>Mary</div></div></td>
</tr>
<tr>
<td>Mary</td>
<td>Moe</td>
<td>[e-mail]<div class="append">    
<div class='demolist'>John</div></div> </td>
</tr>
</tbody>
</table>

JavaScript

$(document).ready(function(){
$("#myInput").on("keyup", function() {
var value = $(this).val().toLowerCase();
var elem = $(".demolist");
var ap = $(".append");
elem.each(function(index, el) {
$(this).detach();
});
$("#myTable tr").filter(function() {
$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1); 
});
ap.each(function(index, el) {
$(this).append(elem[index]);
});
});
});

您可以在这里看到工作示例:https://jsfiddle.net/cm3ns1wx/