Question

感谢上一篇文章@AndyE的帮助，您的解决方案效果很好。

现在我的跟进，同样的想法，不同的功能......我试图实现你以前的解决方案，但是无法让它正常工作......：

$(document).keypress(function(e) {  
    if (e.which == 27) { 
     $('#timeline-2010-1').hide(); 
     $('#timeline-2010-2').hide();
     $('#timeline-2010-3').hide();
     $('#timeline-2010-4').hide();
     $('#timeline-2010-5').hide();
     $('#timeline-2010-6').hide();
     $('#timeline-2010-7').hide();
     $('#timeline-2010-8').hide();
     $('#timeline-2010-9').hide();
     $('#timeline-2010-10').hide();
     $('#timeline-2010-11').hide();
     $('#timeline-2010-12').hide();
     $('#timeline-2010-13').hide();
     $('#timeline-2010-14').hide();
     $('#timeline-2010-15').hide();
     $('#timeline-2010-16').hide();
     $('#timeline-2010-17').hide();

    } 
}); 


$('a.close').click(function() {  
     $('#timeline-2010-1').hide();  
     $('#timeline-2010-2').hide(); 
     $('#timeline-2010-3').hide(); 
     $('#timeline-2010-4').hide();  
     $('#timeline-2010-5').hide();
     $('#timeline-2010-6').hide();
     $('#timeline-2010-7').hide();
     $('#timeline-2010-8').hide();
     $('#timeline-2010-9').hide();
     $('#timeline-2010-10').hide();
     $('#timeline-2010-11').hide();
     $('#timeline-2010-12').hide();
     $('#timeline-2010-13').hide();
     $('#timeline-2010-14').hide();
     $('#timeline-2010-15').hide();
     $('#timeline-2010-16').hide();
     $('#timeline-2010-17').hide();
     return false;  
  });


});

Answer 1

我会给这些元素一个类，例如：

<div id="#timeline-2010-1" class="timelineNode">Stuff</div>

然后你可以把它缩小到：

$(function() {
  $(document).keypress(function(e) {  
    if (e.which == 27) { 
      $('.timelineNode').hide(); 
    } 
  }); 
  $('a.close').click(function() {  
    $('.timelineNode').hide(); 
    return false;  
  });
});

Answer 2

尝试使用"[attr^='val']"选择器模式（实际上是一个开头）。

$('a.close').click(function() {  
     $("[id^='timeline-2010-']").hide();  
     return false;  
  });

Answer 3

$(function() {
    $(document).keypress(function(e) {
        $('[id^=timeline-]').hide();
    });

    $('a.close').click(function() {  
        $('[id^=timeline-]').hide();
        return false;
    });
});

或者只是给这些元素一个公共类并使用类选择器。

Answer 4

如果您想要关闭转义链接或关闭链接上的所有打开元素，请尝试以下操作：

<script>
$(document).ready(function()
{ 
    $("a.timeline-2010").click(function() 
    {
        $(this).parent().children("div.timeline-2010").show();
        return false;
    });
    $(document).keypress(function(e) 
    {
        // firefox and IE for escape key
        if (e.which == 27 || e.which == 0) 
        { 
            // hide all of the divs
            $('div.timeline-2010').hide(); 
        } 
    }); 
    $('a.close').click(function() 
    {  
        $('div.timeline-2010').hide(); 
        return false;  
    });
});
</script>

我的HTML如下：

<div>
  <a class="timeline-2010" href="#">blah</a>
    <div class="timeline-2010" style="display: none;"><a href="" class="close">Close</a>
        Stuff that is hidden to be shown
    </div>
</div>
<div>
  <a class="timeline-2010" href="#">blah</a>
    <div class="timeline-2010" style="display: none;"><a href="" class="close">Close</a>
        Stuff that is hidden to be shown
    </div>
</div>
<div>
  <a class="timeline-2010" href="#">blah</a>
    <div class="timeline-2010" style="display: none;"><a href="" class="close">Close</a>
        Stuff that is hidden to be shown
    </div>
</div>

jQuery结合语句？（跟进）

4 个答案:

jQuery结合语句？ （跟进）

4 个答案:

jQuery结合语句？（跟进）