javascript - 在 keyup 上搜索数据值

Question

因此，我在输入时需要显示具有等于 data-value="certain text"的某些文本的元素。我尝试了多种方法，但似乎没有任何效果。 这是我到目前为止所拥有的。

$(".search").keyup(function () {

    var filter = $(this).val(), count = 0;
    $(".element-holder .element").each(function () {

        var current = $('.element').attr('data-name');
        if ($(".element[data-name='" + current + "']").text().search(new RegExp(filter, "i")) < 0) {
            $(this).fadeOut();
        } else {
            $(this).show();
            count++;
        }
    });

});

这就是我需要帮助的;l

@编辑

此处为 HTML

            <div class="element-holder ">
                        <div class="element" data-name='Adam' id='1'>
                        </div>
                        <div class="element" data-name='Eva' id='32'>
                        </div>
                        <div class="element" data-name='Sara' id='412'>
                        </div>
            </div>

Answer 1

请尝试以下

$(".search").keyup(function () {

        var filter = $(this).val(), count = 0;
        $(".element-holder .element").each(function () {

            var current = $('.element').attr('data-name');
            if ($(this).text().search(new RegExp(filter, "i")) < 0) {
                $(this).fadeOut();
            } else {
                $(this).show();
                count++;
            }
        });

    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="search"/>
 <div class="element-holder ">
<div class="element" data-name='Adam' id='1'>How to Format
</div>
<div class="element" data-name='Eva' id='32'>How to Edit
</div>
<div class="element" data-name='Sara' id='412'>Searching throught data-value on keyup
</div>
</div>