Javascript jquery mobile listview过滤后计数项

我需要一些帮助。我试图通过单击按钮或应用文本过滤器，在应用过滤器后显示可见listview项目的数量。点击按钮只是简单地将文本放入文本过滤器，所以它是相同的触发点

Html非常像这样

    <div>
        <form class="ui-filterable">
            <input id="myFilter" data-type="search" placeholder="Text Filter...">
        </form>

        <div data-role="fieldcontain">
            <input type="button" data-inline="true" value="More Info Provided" id="more-info-provided-filter" />
            <input type="button" data-inline="true" value="In Progress" id="in-progress-filter" />
        </div>

        <p id="listInfo"></p>

        <ol data-role="listview" id="myList" data-filter="true" data-input="#myFilter"></ol>        
    </div>

$(document).on('click', '#in-progress-filter', function(){       
    $('input[data-type="search"]').val('in progress');
    $('input[data-type="search"]').trigger("keyup");

    var volListItemsDisplayed;
    volListItemsDisplayed = $("#myList li:visible").length;    
    document.getElementById("listInfo").innerHTML = "Number of items (filter on): " + volListItemsDisplayed;
});

javascript在应用过滤器之前激发。有没有一种方法可以将我的函数附加到过滤器上，比如onchange类型的事件？您可以假设listview中填充了包含按钮应用的任一文本字符串的记录

---

谢谢

使用JQM，您可以通过以下方式完成：

$(document).on("pagecreate", "#search-page-id", function(e) {
    $("#my-list" ).on("filterablefilter", function(e, data) {
        var result = $(this).children("li").not(".ui-screen-hidden").length;
        console.log("FILTERED ITEMS: ",result);
    });
});

如果在listview中也有列表分隔符，可以通过排除它们来缩小筛选范围：

var result = $(this).children("li").not("[data-role=list-divider]").not(".ui-screen-hidden").length;

---

使用JQM，您可以按以下方式执行：

$(document).on("pagecreate", "#search-page-id", function(e) {
    $("#my-list" ).on("filterablefilter", function(e, data) {
        var result = $(this).children("li").not(".ui-screen-hidden").length;
        console.log("FILTERED ITEMS: ",result);
    });
});

如果在listview中也有列表分隔符，可以通过排除它们来缩小筛选范围：

var result = $(this).children("li").not("[data-role=list-divider]").not(".ui-screen-hidden").length;

---

使用事件计数

li:visible

元素。感谢Omar，我确信使用li:visible也会起作用，您提出的filterablefilter建议帮助实现了我所期望的目标使用事件计数

li:visible

元素。感谢Omar，我确信使用li:visible也会起作用，正是你提出的过滤建议帮助我实现了我想要的目标。这看起来不错，我今天晚些时候回家后会尝试实施，谢谢！太棒了，这用更少的代码行解决了我的问题，谢谢

$（“li:visible”，this）。长度
更短；）这看起来不错，我今天晚些时候回家后会尝试实施，谢谢！太棒了，这用更少的代码行解决了我的问题，谢谢
$（“li:visible”，this）。长度
更短；）