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中执行此操作。

Answer 2

克雷格非常接近。在“.hide（）”或“.show（）”之前加上“.parent（）”来显示或隐藏父div。

关于你的第二个评论，这是一个单独的问题但是，你需要考虑非文本输入。另一个想法是在过滤器文本框为空白时显示所有内容。

使用Javascript过滤div的“列表”

2 个答案: