javascript - jQuery keyup 过滤器在内容位于列中时有效，但在 float : left; 时无效

Question

遇到一个问题，在您输入内容后(输入“spore”然后删除它)，方框不会重置为 2x4(而是上面有 6 个，下面有 2 个)。如果我将框放入 4 列，它会起作用，但如果我只是 float: left on #sortables 就不行。

这是有效的 fiddle (带列):http://jsfiddle.net/SkQPZ/1

这是不起作用的 fiddle (带 float ):http://jsfiddle.net/4pBFu/ .我希望这个 fiddle 能工作。

下面是我的 jQuery。

    (function ($) {
jQuery.expr[':'].Contains = function (a, i, m) {
    return (a.textContent || a.innerText || "").toUpperCase().indexOf(m[3].toUpperCase()) >= 0;
};

function listFilter(gamefilter, list) {
    var form = $("<form>").attr({
        "class": "filterform",
            "action": "#"
    }),
        input = $("<input>").attr({
            "class": "filterinput",
            "type": "text",
            "placeholder": "Filter"

        });

    $(form).append(input).appendTo(gamefilter);
    $(input).change(function () {
        var list = $("#sortable");
        var filter = $(this).val();
        console.log(filter.length);
        if (filter.length > 0) {
            $(list).find("a:not(:Contains(" + filter + "))").parent().slideUp();
            $(".number").hide();
            $(".numberstwo").hide();

        } else {
            console.log($(".number"));
            $(".number").show();
            $(".numberstwo").show();
            $(list).find("a").parent().slideDown();
        }
        return false;
    }).keyup(function () {
        $(this).change();

    });
}
$(function () {
    listFilter($("#gamefilter"), $("#sortable"));

});
}(jQuery));

Answer 1

不知道你到底想做什么，所以我用你“坏了”的jsfiddle做了这个这是您要找的吗？

http://jsfiddle.net/4pBFu/8/

本质上，我在 if 中添加了这个，以在删除一些文本后显示符合过滤器的元素。

$(list).find("a:Contains(" + filter + ")").parent().show();