javascript - 动态元素上的 jQuery find() 和 each()

Question

我有一个 <div>包含多个其他 <div> 的元素是使用 jQuery/Ajax 动态填充的，我正在尝试运行以下代码，但是 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()等等..但似乎没有找到任何结果&当在我的输入字段中输入文本时，没有任何反应

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();
        }
    });