输入框input值变化

最新推荐文章于 2023-12-29 23:26:56 发布

原创最新推荐文章于 2023-12-29 23:26:56 发布 · 663 阅读

0 ·

CC 4.0 BY-SA版权

JS 同时被 2 个专栏收录

13 篇文章

订阅专栏

JQuery

5 篇文章

订阅专栏

本文介绍了一个使用jQuery实现的简单实时搜索功能，当用户在输入框中键入文字时，页面上指定元素的内容会根据输入进行筛选并高亮显示匹配项。此外，还演示了如何对表格行进行过滤。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

var $ = jQuery;

$("document").ready(function () {
var html = "<span id='result'>Hello</span>"
$('#searchword').after(html);

    $("#searchword").each(function () {
        $(this).bind('keyup', hoge(this));
    });
    function hoge(elm) {
        var v, old = elm.value;
        return function () {
            if (old != (v = elm.value)) {
                old = v;
                str = $(this).val();
                $("#result").text(str);
                FilterList(str);
            }
        }
    }

function FilterList(str) {

            $('#japanfood tr').show();
            var searchvalue = str;
            $("input").css("background-color", "#D6D6FF");
            $('#japanfood tr').each(function () {

var text = $(this).html();

                if (text.indexOf("th") != -1) {
                    $(this).show()
                }
                else {
                    if (text.indexOf(searchvalue) == -1) {
                        $(this).hide();
                    }
                }

});

}

});