单击简单按钮 - 显示内容问题

时间:2014-07-23 00:24:32

标签: javascript jquery

我知道这可能是一个非常简单的错误,但是我已经花了最后一小时才能完成这件事,我不能为我的生活找出原因,为什么它不起作用

我想要做的是建立一个推荐部分,用户将在其中:

  • 点击公司徽标
  • 如果现有推荐书有效,请将其删除
  • 加载选定的推荐书

我做错了什么?

小提琴:http://jsfiddle.net/rv9HF/

$('.logobuttons a').click(function() {
   var link = $(this).attr('class');

   $('.testimonial-content blockquote').each(function() {
        if ($(this).is(':visible')) {
            $(this).fadeOut(300);
        }
   });

   $('testimonial-content ' + link).fadeIn(300);
});



<section id="testimonials">
   <div class="logobuttons">
       <a class="tc-1" href=""><img src="http://placehold.it/100x100"></a>
       <a class="tc-2" href=""><img src="http://placehold.it/100x100"></a>
       <a class="tc-2" href=""><img src="http://placehold.it/100x100"></a>
       <a class="tc-2" href=""><img src="http://placehold.it/100x100"></a>
   </div>
   <div class="testimonial-content">
       <blockquote class="tc-1">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit</p>
       </blockquote>
       <blockquote class="tc-2">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit</p>
       </blockquote>
       <blockquote class="tc-3">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit</p>
       </blockquote>
       <blockquote class="tc-4">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit</p>
       </blockquote>
   </div>
</section>

1 个答案:

答案 0 :(得分:3)

你在Sizzle选择器中错过了两个句号,这应该可行。

    $('.logobuttons a').click(function(e) {
        var link = $(this).attr('class');

        $('.testimonial-content blockquote').each(function() {
             if ($(this).is(':visible')) {
                 $(this).fadeOut(300);
             }
        });

      $('.testimonial-content .' + link).fadeIn(300);

       e.preventDefault();
   });