Question

演示：http://jsfiddle.net/sky94132003/gbptvmnk/

我为我的网站创建了评论功能

有一个按钮供用户点击回复评论。

onclick函数将做一些事情

1. open slideToggle
2. animate scrollTop to the comment box (textarea)
3. animate backgroundColor (notic user where comment.)


$(function() {
    $( ".reply_video" ).click(function() {
      $(".comment_reply_video").slideToggle( "fast" );
         $('html,body').animate({
              scrollTop:$('.comment_reply_video').offset().top-90}, 800);
          $(".comment_reply_video").animate({
                backgroundColor: '#CCC'
          }, 800 );      
         setTimeout(function() {
                $(".comment_reply_video").animate({
                    backgroundColor: '#FFF'
              }, 1200 );
         }, 1500); 

      $(".r_all").focus();
    });
});

但是用户点击第一个将打开slideToggle。

我怎样才能设置刚刚第一个将是活动的slideToggle函数？

如果打开。 onclick只是为了做

2.animate scrollTop to the comment box (textarea)    
3.animate backgroundColor (notic user where comment.)

并且不要关闭slideToggle

Answer 1

我已经更新了你的代码。

在切换事件中添加了$(".reply_video").off("click")。

$( ".reply_video" ).click(function() {
  $(".comment_reply_video").slideToggle( "fast" );
     $('html,body').animate({
          scrollTop:$('.comment_reply_video').offset().top-90}, 800);
      $(".comment_reply_video").animate({
            backgroundColor: '#CCC'
      }, 800 );      
     setTimeout(function() {
            $(".comment_reply_video").animate({
                backgroundColor: '#FFF'
          }, 1200 );
     }, 1500); 
    $(".reply_video").off("click");
  $(".r_all").focus();
});

Answer 2

用.one替换.click（＆＃39;点击＆＃39;，... 例如：

 $( ".reply_video" ).one('click',function() { ... });

但是，如果您还想要辅助功能，请使用.is（＆＃39;：可见＆＃39;）功能。

实施例：（内部点击事件）

$( ".reply_video" ).click(function() {
    if (!$(".comment_reply_video").is(":visible")) {
  $(".comment_reply_video").slideToggle( "fast" );
     $('html,body').animate({
          scrollTop:$('.comment_reply_video').offset().top-90}, 800);
      $(".comment_reply_video").animate({
            backgroundColor: '#CCC'
      }, 800 );      
     setTimeout(function() {
            $(".comment_reply_video").animate({
                backgroundColor: '#FFF'
          }, 1200 );
     }, 1500); 
    }

  $(".r_all").focus();
});

如何在第一次点击时设置slideToggle open div？

2 个答案: