2012-04-22 64 views
0

我有一個顯示和隱藏div顯示和隱藏點擊時的評論。默認情況下,在它被點擊之前,它顯示消息計數加上一些向下箭頭,例如如何在Rails ruby​​中訪問rails helper和嵌入式ruby資產JavaScript文件?

「55條[向下箭頭]」

,並單擊時更改爲:

「隱藏評論[向上箭頭]」

我使用此代碼顯示默認的評論數量和箭頭(用戶/新):

<span class="commentsCount"><%= pluralize(m.comments.count, 'comment') %></span> 
    <span class="commentArrows"><%= image_tag 'view_all_comments.png' %> </span> 

我使用jQuery來幫助實現改變(用戶/ load_comments.js.erb):

$('.postHolder').off().on('ajax:success', '.view_all_comments', function(){ 

    var postContent = $(this).parents('.post_content'), 
     commentContainer = postContent.find('.comment_container'), 
     getComments = "<%= j render 'users/partials/show_all_comments' %>"; 
     commentContainer.slice(0, -2).remove(); 

// The next 2 lines replace the comment count with "Hide comments" and up arrows" 

      postContent.find('.commentsCount').html("Hide comments"); 
      postContent.find(".commentArrows img").prop("src", "/assets/up_arrows.png"); 

      postContent.find('.comment_container:first').before(getComments); 
}); 

現在重要的部分是當隱藏評論再次點擊。我需要它恢復顯示評論數量。我可以將箭頭還原爲原始箭頭,但文本中我沒有看到回到註釋帳戶的方式,因爲我無法在assets/javascripts/users.js文件中訪問rails helper和實例變量等。

下面是代碼(資產/ Java腳本/ users.js:

// for showing and hiding comments 

     $('.expandComments').click(function() { 

     var showAllCommentsSubmit = $(this).find('.showAllCommentsSubmit'), 
      postContent = $(this).parents('.post_content'), 
      commentContainer = postContent.find('.comment_container'); 


      if ($(this).hasClass('visible')) { 
       postContent.find(".comment_container").slice(0, -1).hide(); 
       postContent.find(".commentArrows img").prop("src", "/assets/view_all_comments.png"); 

//Here is where I need the code to replace the "Hide comments" text. 

      } else { 


       if (showAllCommentsSubmit.is(':disabled')) { 
        postContent.find(".comment_container").show(); 
        postContent.find(".commentArrows img").prop("src", "/assets/hide_comments.png"); 

       } else { 
        showAllCommentsSubmit.trigger('submit'); 
        showAllCommentsSubmit.prop({disabled: true}); 
        postContent.find(".commentArrows img").prop("src", "/assets/comments-loader.gif"); 
       } 
      } 

      $(this).toggleClass('visible'); 

     }); 

因爲我不認爲這是可以使用嵌入的Ruby/Rails傭工JavaScript文件我怎麼會是資產能夠達到我想要達到的。

是否有某種方式來顯示其他HTML基礎上增加一些HTML然後將其刪除時,不需要的話更多,並有HTML下方再次顯露呢?

我敢肯定還有其他一些解決方案,我可以拿出來,比如帶來一些css進入遊戲..有一個div隱藏和顯示,但我還沒有想到我會如何做到這一點。想知道是否有快速解決方案。

回答