Onclick事件不会将类添加到div

时间:2014-06-11 02:00:46

标签: jquery

我不知道什么是错的但是在点击事件上它不会添加类来显示我需要的东西。这是我的代码。 .rrssb-buttons显示:无

<script>
    $('#share').on('click',function(){
       $('.rrssb-buttons').addClass('active');
    });
</script>

我还将包括我添加div触发器的所有div。

<div class="talkofweb-floats">  

    <div class="timeago"><?php echo human_time_diff( get_the_time('U'), current_time('timestamp') ) . ' ago'; ?></div>  
    <div class="post-image"><?php the_post_thumbnail('home-thumb'); ?></div>
    <div class="post-text"><?php the_content(); ?></div>
    <div class="post-likes"><?php if( function_exists('zilla_likes') ) zilla_likes(); ?></div>
    <div class="sharing"> <?php echo do_shortcode('[rrssb]'); ?></div>
    <div id="share">Share</div>

</div>

5 个答案:

答案 0 :(得分:3)

换行

 $('#share').on('click',function(){
       $('.rrssb-buttons').addClass('active');
    });

在jquery里面

$(document).ready(function(){
   $('#share').on('click',function(){
   $('.rrssb-buttons').addClass('active');
});
});

或更短的版本

$(function(){
  $('#share').on('click',function(){
       $('.rrssb-buttons').addClass('active');
    });
});

并确保您已导入jquery库

答案 1 :(得分:0)

尝试在$(document).ready中包装你的JS(function(){..}); 并确保先前包含jquery。

像:

<script>
    $(document).ready(function(){
      $('#share').on('click',function(){
         $('.rrssb-buttons').addClass('active');
      });
    });
</script>

此外,正如我注意到您正在使用wordpress,一些wordpress主题将需要您使用&#39; jQuery&#39;取代&#39; $&#39;注解。如:jQuery(document).ready(...

最后,添加一个活跃的课程&#39;除非.active css类包含display:block;否则不一定会使按钮可见。 (或将其纳入视野的其他价值)。

答案 2 :(得分:0)

您的脚本何时添加?在生成DOM之前或之后?

如果在生成DOM之前添加它,那么在创建事件期间,没有ID为ID =&#34; SHARE&#34;是可用的...因此,不会产生任何东西。

上述等待文档准备就绪的解决方案是确保完成DOM以创建点击事件,但非强制性可使您的活动正常工作。

答案 3 :(得分:0)

如上所述,最好将您的功能包装在$(document).ready(function());

$(document).ready(function(){
    $('#share').on('click',function(){
        $('.rrssb-buttons').addClass('active');
    });
});

如果在创建DOM之后添加元素,则需要绑定到文档:

$(document).on('click','#share',function(){

虽然查看代码,但我认为.rrssb-buttons中有多个按钮? 所以你必须遍历它们并将它们添加到每个类中(看起来它们都在div中)。

$('.rrssb-buttons div').each(function(){'
    $(this).addClass('active');
});

答案 4 :(得分:0)

    var_dump(do_shortcode('[rrssb]'));
//true: return string html

添加console.log('string');以点击功能

试一试:

$('#share').click(function(){
   console.log('foo');
   $('.rrssb-buttons').show().addClass('active');
});

或将此代码.active{display: block !important;}添加到css文件中。