时间戳

首页 > 解决方案 > 单击而不是输入或键入时过滤列表

javascript - 单击而不是输入或键入时过滤列表

问题描述

我找到了一个允许用户搜索我的树形菜单的 javascript。但是，我需要它仅在单击按钮时起作用，而不是在用户键入时起作用。我知道如何创建按钮并将 OnCLick 添加到其中，但我无法弄清楚如何更改我的工作脚本以仅在单击按钮时运行。

这是工作脚本（我必须给 li 标签一个类，这样脚本就不会尝试搜索页面上的其他列表）：

<script type="text/javascript">
$(document).ready(function () {
    $("#search").on("input", function () {
        if (this.value.length > 0) {
            $("li.menusearch").hide().filter(function () {
                return $(this).text().toLowerCase().indexOf($("#search").val().toLowerCase()) != -1;
            }).show();
      }
        else {
            $("li.menusearch").show();
        }
    });
});

这是输入

<input type="search" id="search" name="search"/>

标签： javascriptjquerysearchdrop-down-menu

解决方案

要调整您的脚本以在单击按钮时工作，请按如下方式调整它（与#button您的按钮的 id 相对应）：

 $(document).ready(function () {
    $("#button").on("click", function () {
       if ($("#search").val().length > 0) {
           $("li.menusearch").hide().filter(function () {
              return $(this).text().toLowerCase().indexOf($("#search").val().toLowerCase()) != -1;
        }).show();
       }
       else {
          $("li.menusearch").show();
       }
   });
});

推荐阅读