Question

我有一个<div>元素，其中包含使用jQuery / Ajax动态填充的多个其他<div>，我正在尝试运行以下代码，但find()失败得到他们中的任何一个。

这是我填充数据之前的HTML样板文件。

<input type="text" id="inv-filter" class="form-control">
<div class="row itemList" style="margin-right: -2px;margin-left:-2px;">

</div>

以下是人口后的情况。

<input type="text" id="inv-filter" class="form-control">
<div class="row itemList" style="margin-right: -2px;margin-left:-2px;">
    <div class="col-xs-3 col-sm-2 shop-item" data-hash="Item Name 1">

    </div>
    <div class="col-xs-3 col-sm-2 shop-item" data-hash="Item Name 2">

    </div>
    ......
</div>

我的Javascript如下所示：

$('#inv-filter').keyup(function() {
    var search = $(this).val().toLowerCase();
    var $sellContainer = $('.itemList');
    if (search.trim() === '') {
        $sellContainer.find('.shop-item').show();
        $sellContainer.find('.shop-item.selected').hide();
        return;
    }
    $sellContainer.find('.sell-item').each(function() {
        if (!$(this).hasClass('selected') && $(this).data('hash').text().toLowerCase().includes(search)) {
            $(this).show();
        } else {
            $(this).hide();
        }
    });
});

我在控制台调试器中运行了多个测试，例如$('.itemList').length()等。但似乎没有找到任何结果＆amp;在我的输入字段中输入文本时，没有任何事情发生

Answer 1

$sellContainer.find('.sell-item').each(function() { //replace sell-item with shop-item
        if (!$(this).hasClass('selected') && $(this).data('hash').text().toLowerCase().includes(search)) {
            $(this).show();
        } else {
            $(this).hide();
        }
    });

jQuery find（）＆amp;动态元素上的each（）

1 个答案: