Question

尝试使用javascript创建实时搜索，似乎脚本没有响应。我在.js文件中有脚本，我已经在页面末尾添加了它。

我想要的功能是当用户输入#PokemonSearch时，它会隐藏不相关的pokemon-selector-item div

使用以下代码输入#PokemonSearch时会发生什么？绝对没有。

$(document).ready(function(){
$("#PokemonSearch").keyup(function(){

    // Retrieve the input field text and reset the count to zero
    var filter = $(this).val(), count = 0;

    // Loop through the comment list
    $(".pokemon-selector-item").each(function(){

        // If the list item does not contain the text phrase fade it out
        if ($(this).attr(".pokemon-name").text().search(new RegExp(filter, "i")) < 0) {
            $(this).fadeOut();

        // Show the list item if the phrase matches and increase the count by 1
        } else {
            $(this).show();
            count++;
        }
    });

  });

});

HTML选择器项目示例：

                            <div class="pokemon-selector-item">
                                <img class="pokemon-image" src="~/assets/images/pokemon/pokemon-50x50/charmander.png" />
                                <div class="pokemon-selector-info">
                                    <span class="pokemon-name">Charmander</span>
                                    <span class="pokemon-type">Fire Pokemon</span>
                                </div>
                            </div>

Answer 1

你有一个错字。第11行的.attr(".pokemon-name")应为.find(".pokemon-name")

Javascript实时搜索无响应？

1 个答案: