jQuery 字典字母过滤器到 SharePoint 列表

Question

我在 SP2013 中有一个列表，我在发布页面上使用 Javascript 提取列表项。我需要对这个列表应用字母过滤，但过滤器在这个列表上不起作用；但是，过滤器在纯静态文本上工作得很好。这是我拉列表项的代码：

    $(function () {
        if (glossaryQuery && glossaryQuery.Rows) {
        var liGlossaryHTML = [];
        $('#glossary_list').toggle();
        $.each(glossaryQuery.Rows, function (index, r) {
            liGlossaryHTML.push('<li><strong>' + r.Title + '</strong><br/>' + r.Definition + '</li>');
        });            
        $('#glossary_list ul').html(liGlossaryHTML.join(''));
    }
}); 

这里是过滤器：

   var triggers = $('ul.alphabet li a');
    var filters = $('#glossary_list ul li');

    triggers.click(function() {
    var takeLetter = $(this).text(), result = 0;
    filters.parent().hide();

filters.each(function(i) {
    if ( RegExp('^'+takeLetter).test($(this).text()) ) {
        result += 1;
        $(this).parent().fadeIn(222);
    }
});

});

和 HTML：

<div id="glossary_list" style="display:none;">
<ul></ul>
</div>

非常感谢任何帮助。

Answer 1

我的怀疑是，因为您在页面加载后添加列表项，filters 在运行时实际上并不匹配任何内容。我建议在点击处理程序中移动分配。您还可以进行一些其他改进以使其更高效/更易读。

$('ul.alphabet li a').click(function() {
    var takeLetter = $(this).text(),
        result = 0
        expr = new RegExp('^' + takeLetter);

    var filters = $('#glossary_list ul li')
        .parent()
        .hide();

    filters.each(function(i) {
         var $filter = $(this);
         if (expr.test($filter.text())) {
             result += 1;
             $filter.parent().fadeIn(222);
         }
    });
});