Question

我有一个文本输入搜索，应该根据div的标题过滤div。以下是无效的代码：

$('.contact-name').each(function(){
  var txt = $('#search-criteria').val();
  $('this').find(txt).show()      
});

我做错了什么？

编辑：澄清变量txt是用户在输入字段中键入的内容。一个例子是如果txt是Cha我想要这行显示：

<div class="contact-name"><h3><a href="##">Charles Smith</a></h3></div>

Answer 1

试试这个

var txt = $('#search-criteria').val();
$('.contact-name:contains("'+txt+'")').show();

<强> documentation for :contains() Selector

小提琴示例：http://jsfiddle.net/WBvTj/2/

更新案例不敏感：

var txt = $('#search-criteria').val();
$('.contact-name').each(function(){
   if($(this).text().toUpperCase().indexOf(txt.toUpperCase()) != -1){
       $(this).show();
   }
});

小提琴示例：http://jsfiddle.net/WBvTj/4/

Answer 2

幸运的是，jQuery有一个 Contains 选择器：

$('.contact-name').each(function(){
  var txt = $('#search-criteria').val();
  $(this).find('div:contains("'+txt+'")').show()      
});

Answer 3

find方法将JQuery选择器作为参数。我怀疑你的search_criteria文字输入会包含它。假设它将包含DIV标题的一些子字符串，那么试试这个：

var txt = $('#search-criteria').val();    
$('.contact-name').each(function(i, e){
  if($(e).attr("title").indexOf(txt)>=0) $(e).show();
});

Answer 4

以下内容应该不区分大小写，并且仅匹配div中第一个href中的文本：

var pattern = "/" + $('#search-criteria').val() + "/i";
$('.contact-name').filter(function() {
    return $(this 'a:first-child').html().match(pattern).length > 0;
}).show();

filter为您提供了一个元素列表，该元素从该函数返回true以将show（）应用于。
filter函数中的返回值可以理解为：＆＃34;对于此元素中的第一个锚元素，获取内容，将其与模式匹配，如果结果数组包含1个或多个结果，则返回true＆＃34;

＆＃34; i＆＃34;在模式的最后是让你不区分大小写的匹配。

根据文本搜索显示div

4 个答案: