Question

我有以下情况，如果有人可以提供帮助，那就太好了。

    $(".brand-nav").click(function(e){
        var type = $(this).attr( id );
        $('.article').hide();
        $('.' + type).show();            
        e.preventDefault();            
        $(".letter-section").each(function (i) {
            var siblings = $(i).siblings(":visible").length;
            if (siblings == 0) {
                $(i.big-lettter').hide();
            } else {
                $(i.big-lettter').show();
            }
        }
    });

我已经让这个JS小提琴包含了一个关于HTML的想法：http://jsfiddle.net/BEa4x/因为当我在这里发布时它没有正确格式化。

当您点击顶部菜单时，它应该隐藏所有链接，然后只显示链接ID的相关链接。

如果那时你单击食物意味着'A'部分中没有可见的链接，因此我也需要A隐藏，否则它应该显示。

任何帮助表示赞赏： - ）

Answer 1

好的，那里有一些语法错误......以及一些逻辑错误。试试这个：

 $(".brand-nav").click(function(e) {
     var type = $(this).attr('id'); // id needs quotes
     $('.article').hide();
     $('.' + type).show();            
     e.preventDefault();            
     $(".letter-section").each(function (i) {
         var siblings = $(this).find('li').filter(':visible'); // i is the index, "this" is the actual DOM element. Also you need the descendants 'li', not his siblings
         if (siblings.size() == 0) {
             $(this).children('.big-letter').hide(); // again, use "this" and get the children (you may want to filter the first also).
         }
         else {
             $(this).children('.big-letter').show(); // remember to show again or it will stay hidden :)
         }
     }); // you also forgot to close this bracket
 });

小提琴：http://jsfiddle.net/BEa4x/21/

Answer 2

$(document).ready(function() {
    $(".brand-nav").click(function(e){
        e.preventDefault();            

        // Note that id has to be quoted here.
        var kind = $(this).attr('id');

        // First of all show all the letters
        // in case they had been hidden previously
        $('.letter-section').show();

        // Hide all the articles and only show the ones that
        // match the id of the element that's been clicked on.
        $('.article').hide();
        $('.' + kind).show();

        // For each letter section...
        $('.letter-section').each(function(index, element) {
            // Check if its visible li count is 0
            if ($(element).contents('li:visible').length == 0) {
              // If it is, hide the letter!
              $(element).hide();   
            }
        });
    });    
});

您可以在此处看到它：http://jsfiddle.net/BEa4x/23/

这是一个非常快速和肮脏的代码修复，如果我是你，我会重构它，首先将字母部分内容检查放入它自己的函数。

隐藏兄弟姐妹，如果没有可见的

2 个答案: