javascript - 如何根据文本值构建简单的 jQuery 字典字母过滤器？

Question

我在创建它时没有遇到问题，我的问题是:当我尝试检测空返回时。我准备了 jsFiddle 来检查，单击“B”以找到我要查找的内容，但要用可靠的方法。

基本上我是想用聪明的方法检查结果是否为空？

jsFiddle example.

jQuery:

var triggers = $('ul.alphabet li a');
var filters = $('ul.medical_dictionary li strong');

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

    filters.each(function(i) {
        var compareFirstLetter = $(this).text().substr(0,1);
        if ( compareFirstLetter ==  takeLetter ) {
            $(this).parent().fadeIn(222);
        }

        //problem on detecting empty one. Press 'B' for example.
        //i can reach manually but this way is useless
        if (takeLetter ==='B') {console.log('There is no result.');}
    });

});

html:

<ul class="alphabet">
    <li><a>A</a></li>
    <li><a>B</a></li>
    <li><a>C</a></li>
    <li><a>...</a></li>
</ul>

<ul class="medical_dictionary">
      <li><strong>Abdominoplasti</strong>: Lorem ipsum.</li>
      <li><strong>Absans</strong>: Lorem ipsum.</li>
      <li><strong>Abse</strong>: Lorem ipsum.</li>
      <li><strong>....</strong>: Lorem ipsum.</li>
</ul>

Answer 1

尝试以下操作:

请注意，我添加了新变量 found，只要单击新字母表，它就会设置为 false。一旦找到与字母匹配的字典条目，此变量就会设置为 true。

现在在循环后检查相同的变量以检查是否找到相关条目，或者如果没有找到条目则不显示任何结果。

var triggers = $('ul.alphabet li a');
var filters = $('ul.medical_dictionary li strong');

triggers.click(function() {
    var takeLetter = $(this).text();
    var found = false;
    filters.parent().hide();

    filters.each(function(i) {
        var compareFirstLetter = $(this).text().substr(0,1);
        if ( compareFirstLetter ==  takeLetter ) {
            $(this).parent().fadeIn(222);
            found = true;
        }
    });
    if (!found) {console.log('There is no result.');}
});