使用 JQuery 的 SlideUp() 和 SlideDown() 实现搜索框最后一个元素的奇怪行为

发布于 2024-11-15 14:50:26 字数 990 浏览 2 评论 0原文

我正在使用 JQuery 实现动态搜索选项，当用户输入搜索文本时，列表开始对不匹配的元素使用 SlideUp() ，对匹配的元素使用 SlideDown() 。我使用了这个网站作为基础，除了一个小而令人不安的细节外，它运行得很好。

当我输入文本（例如，SlidesUp 5 个列表元素中的 2 个）时，当我删除之前输入的文本时，只会出现其中的 4 个（而不是原来的 5 个）。而且它并不总是与最后隐藏的元素相同。

这是我的相关代码：

$("#searchTextBoxId").change(function(){}).keyup( function () {
    $(this).change();
});
$("#searchTextBoxId").change(function(){
    var filter = $("#searchTextBoxId").val();
    if (filter){$("#ajaxListView").find("name:not(:Contains("+filter+"))").parent().parent().slideUp();$("#ajaxListView").find("name:Contains("+filter+")").parent().parent().slideDown();      
    }else{
    $("#ajaxListView").find('untipodedom').slideDown();
    $("#mst").text("Amount of elements: "+$("#ajaxListView").find('untipodedom').length);       
    }
});

更奇怪的是输出文本显示 5（它应该显示的 div 数量）。有什么想法吗？？？

原文

I am using JQuery to implement a dynamic search option, where as the user types in the searched text, the list starts to SlideUp() those elements that don't match, and SlideDown() those that do. I used this site as base, and got it working pretty good, except for one small yet nerving detail.

When i type in a text which for example SlidesUp 2 out of 5 of the lists elements, then when i erase the previously typed in text, then only 4 of them appear (instead of the original 5).
And it is not always the same element the one that remains hidden at the end.

This is my relevant code:

$("#searchTextBoxId").change(function(){}).keyup( function () {
    $(this).change();
});
$("#searchTextBoxId").change(function(){
    var filter = $("#searchTextBoxId").val();
    if (filter){$("#ajaxListView").find("name:not(:Contains("+filter+"))").parent().parent().slideUp();$("#ajaxListView").find("name:Contains("+filter+")").parent().parent().slideDown();      
    }else{
    $("#ajaxListView").find('untipodedom').slideDown();
    $("#mst").text("Amount of elements: "+$("#ajaxListView").find('untipodedom').length);       
    }
});

It is even wierder the fact that the output text says 5 (the amount of div's it should be showing). Any ideas???

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

堇年纸鸢 2024-11-22 14:50:26

好吧，花了很长时间才弄清楚这一点。事实证明这是一件非常愚蠢的事情。我发布此内容是为了防止它最终对某人有帮助。

在“else”情况下，jquery“find”选择器没有正确选择。我将其更改为以下内容：

function SlideUpAndDown(filter){
    if (filter){
        $("#cListView").find("name:not(:Contains("+filter+"))").parent().parent().slideUp();
        $("#cListView").find("name:Contains("+filter+")").parent().parent().slideDown();
    } else {
        $("#cListView").find("*").parent().parent().slideDown();            
    }
}

我使用通用选择器“*”来选择 CListView 中的所有项目。就是这样，就像魅力一样。

Ok, it took a LONG while to figure this out. It turned out to be something quite silly. I post this in case it eventually turns out to be helpful for someone.

In the "else" case, the jquery "find" selector wasn't selecting correctly. I changed it to the following:

function SlideUpAndDown(filter){
    if (filter){
        $("#cListView").find("name:not(:Contains("+filter+"))").parent().parent().slideUp();
        $("#cListView").find("name:Contains("+filter+")").parent().parent().slideDown();
    } else {
        $("#cListView").find("*").parent().parent().slideDown();            
    }
}

I used the universal selector '*' in order to select all the items in the CListView. Thats it, works like a charm.

回复收藏 0 原文

~没有更多了~