检查输入是否等于div内的文本

时间:2016-01-20 01:15:55

标签: jquery html css search-box

我正在尝试构建一个搜索我的网站搜索文本的搜索框。现在我正在尝试创建一个jquery keyup()函数,它从我的搜索框中获取输入并将其与两个div中的文本进行比较。当我在搜索输入中键入div的文本内容Tom或Randy时,此代码似乎没有按照我的意图运行。结果是console.log("没有")。

我的Html

<input type="text" id="searchfor">

    <div class ="name"> Tom </div>
    <div class ="name"> Randy </div>

我的jquery

$(document).ready(function(){

      $('#searchfor').keyup(function(){

            $(".name").each(function(){
                    var $divText = $(".name").text().trim().toLowerCase();
                    var $searchInput = $("#searchfor").val().trim().toLowerCase();

                            if($searchInput === $divText) {
                           console.log("something");
                       }else{
                           console.log("nothing");
                       }


             });
      });
});

我想知道如何让$ searchInput等于$ divText,这样当有人在搜索输入字段中键入Randy时,该函数将是console.log(&#34;某些东西&#34;)。谢谢

1 个答案:

答案 0 :(得分:2)

问题是Would you like to submit Heroku CLI usage information to better improve the CLI user experience? [y/N] 将组合所有元素集合的文本。

在您想要特定实例的var $divText = $(".name").text();中,请使用each

$(this)

只有在键入整个名称时才会匹配。

如果您只想使用部分匹配$('#searchfor').keyup(function() { // no need to get value in each iteration of loop...just store it here once var $searchInput = $(this).val().trim().toLowerCase(); // within loop `this` is instance of div.name $(".name").each(function() { var $divText = $(this).text().trim().toLowerCase(); if ($searchInput === $divText) { console.log("something"); } else { console.log("nothing"); } }); });

DEMO