.net - 使用Javascript过滤div的 "list"

Question

我有一个中继器，它为从某种方法返回的每个项目输出如下的 div。

<div class="editor-area">
    <div class="title">the title</div>
    <div>the description</div>
    <div class="bottom-bar">
        <a href="link">Modify</a>
        <a href="link2">Delete</a>
    </div>
</div>

我需要在页面上有一个文本框，允许用户根据标题字段中的内容过滤列表。我希望它在用户输入时发生。

我可以在不寻求帮助的情况下完成这件事，但我想把它做好。我正在使用 ASP.Net 2.0 WebForms(不幸的是)，如果 jQuery 对此有用的话我可以使用它(我对此几乎没有经验)。

任何提示或示例将不胜感激。

如果过滤操作需要几秒钟，如何防止它锁定屏幕？我应该对什么事件进行过滤？ jQuery 中是否有任何东西可以使 javascript 变得更简洁？

Answer 1

是的，这对于 jQuery 来说非常简单。首先隐藏所有内容:

$("div.title").hide();

(将“div”类型的元素与“title”类进行匹配。)现在显示匹配项:

$("div.title:contains(searchText)").show();

Help for "contains".

除非您的页面很大，否则不需要“几秒钟”即可完成此操作。您可以在 onKeyDown 和 onChange 中执行此操作。