Question

我正在尝试在我的网站上进行实时搜索，我已经让它在输入字段和链接标题匹配的地方工作，但它必须是整个单词。是否可以在下面的代码中显示包含变量V的特定值的任何结果：

HTML：

<form id="live-search" action="" class="styled" method="post">
       <input type="text" class="text-input" id="filter" value="" />
</form>


<div class="videoItems">
    <a title="Oliver" href="#" class="comedy"><img src="#" class="coverImg" alt="" /></a>
    <a title="Frank" href="#" class="scifi"><img src="#" class="coverImg" alt="" /></a>
    <a title="Ted" href="#" class="scifi"><img src="#" class="coverImg" alt="" /></a>
    <a title="James" href="#" class="scifi"><img src="#" class="coverImg" alt="" /></a>            
</div>

jQuery的：

$("#filter").keyup(function(){
        var v = $('#filter').val().toLowerCase();
        if ( $('#filter')[0].value.indexOf('> <') !== -1 ){
            $('.videoItems a').show();                
        }
        console.log($('#filter').val());
        if($('#filter').val() == ''){
            $('.videoItems a').show();
        }else{
            $('.videoItems a').each(function(){
                var name = $(this).attr('title').toLowerCase();
                if(name == v){
                    $(this).show(); 
                }else{
                    $(this).hide(); 
                }
            });
        }
 });

我还制作了jsfiddle

提前感谢您的帮助。

Answer 1

解决方案涉及使用indexOf查看一个字符串是否包含另一个字符串。

如果您希望oli和ive都匹配Oliver，请使用以下命令：

http://jsfiddle.net/vQLGG/

if (name.indexOf(v) > -1) {

如果您想要“开始时”搜索，请使用此选项：

http://jsfiddle.net/NSnMH/

if (name.indexOf(v) == 0) {

Answer 2

如果你使用正则表达式进行搜索，你可能会有更大的灵活性，它可以更快地运行。

$("#filter").keyup(function(){
    var v = new RegExp($('#filter').val().toLowerCase(), "g");
    if ( $('#filter')[0].value.indexOf('> <') !== -1 ){
        $('.videoItems a').show();                
    }
    console.log($('#filter').val());
    if($('#filter').val() == ''){
        $('.videoItems a').show();
    }else{
        $('.videoItems a').each(function(){
            var name = $(this).attr('title').toLowerCase();
            if(v.test(name)){
                $(this).show(); 
            }else{
                $(this).hide(); 
            }
        });
    }

}）;

检查字符串是否包含keyup上的任何字符

2 个答案: