Jquery append从Ajax响应数据中删除CSS样式

Question

如何将html返回到我的html的一部分？使用append可以删除在页面加载时隐藏所有表单的样式和默认隐藏功能。

这是我下面的HTML：

<div class="col-md-6"> 
<!-- COMMENT 1 WITHIN COL-MD--6 --> 
<div class="gc gcc"> 

    <div class="upvote"> 

     <i class="fa fa-thumbs-up upvote_true"></i> 
     <span class="like_count">0</span> 

     <form method="POST" class="vote_form" ><input type='hidden' name='token' value='nil' /> 
      <input name="likes" type="hidden" value="1"> 
      <input name="comment_id" type="hidden" value="37"> 
     </form> 
    </div> 

    <div class="downvote"> 
     <i class="fa fa-thumbs-down downvote_false"></i> 

     <span class="like_count">1</span> 
     <form method="POST" class="vote_form" > <input type='hidden' name='token' value='nil' /> 
      <input name="dislikes" type="hidden" value="1"> 
      <input name="comment_id" type="hidden" value="37"> 
     </form> 
    </div> 


    <div class="time_since">1 day, 16 hours ago</div> 

    <div class="clear replies"> 

     <p class="write-up">MAIN COMMENT</p> 

     <img class="side-pic mini-picture" src="img.jpg" width="50" height="50"> 

     <div class="clear"></div> 
     <hr> <!-- Below are replies dynamically generated from another included script--> 

        <p>0 reply</p> 
        <p>1 reply to comment</p> 
        <p>3 reply</p> 
     <hr> 
    </div> 

    <div class="reply_form_post"> 
     <i class="fa fa-reply good_rp" ></i> 
     <i class="fa fa-share mean_rp"></i> 


     <br/> 
     <form method="POST" action="/commentor/comments/" class="post_comment"> <input type='hidden' name='token' value='nil' /> 

      <input class="comment_type" name="comment_type" type="hidden" /> 
      <input class="rep" name="parent_id" type="hidden" value="37"/> 
      <textarea class="comment_form" cols="50" name="comment" placeholder="Reply..." rows="3" /></textarea> 

     </form> 
     <span class="clear"></span> 
    </div> 
</div> 

<br/> 
<!-- COMMENT 2 WITHIN COL-MD--6 --> 
<div class="gc gcc"> 


    <div class="upvote"> 
     <i class="fa fa-thumbs-up upvote_true"></i> 
     <span class="like_count">0</span> 

     <form method="POST" class="vote_form" ><input type='hidden' name='token' value='nil' /> 
      <input name="likes" type="hidden" value="1"> 
      <input name="comment_id" type="hidden" value="36"> 
     </form> 
    </div> 

    <div class="downvote"> 
     <i class="fa fa-thumbs-down downvote_false"></i> 

     <span class="like_count">0</span> 
     <form method="POST" class="vote_form" > <input type='hidden' name='token' value='nil' /> 
      <input name="dislikes" type="hidden" value="1"> 
      <input name="comment_id" type="hidden" value="36"> 
     </form> 
    </div> 


    <div class="time_since">1 day, 16 hours ago</div> 

    <div class="clear replies"> 

     <p class="write-up">Coolest guy ever </p> 
     <img class="side-pic mini-picture" src="img2.png" width="50" height="50"> 
     <div class="clear"></div> 
     <hr> 
      <p> 1 REPLY HERE</p> 
     <hr> 
    </div> 

    <div class="reply_form_post"> 
     <i class="fa fa-reply good_rp" ></i> 
     <i class="fa fa-share mean_rp"></i> 

     <br/> 
     <form method="POST" action="/commentor/comments/" class="post_comment"> <input type='hidden' name='token' value='nil' /> 

      <input class="comment_type" name="comment_type" type="hidden" /> 
      <input class="rep" name="parent_id" type="hidden" value="36"/> 
      <textarea class="comment_form" cols="50" name="comment" placeholder="Reply..." rows="3" /></textarea> 

     </form> 
     <span class="clear"></span> 
    </div> 
</div> 
<br/> 

<!-- COMMENT 3 ... N WITHIN COL-MD--6 SHOULD BE HERE --> 

下面是我的阿贾克斯/ jQuery的。

$(document).ready(function(){ 
     $(".post_comment").hide(); 


     $("#next_pp").click(function(e){ 
        e.preventDefault(); 
        var pageNum = $(this).attr('href').match(/page=(\d*)/)[1]; 

        var commentPart = $('.col-md-6'); 
        $.ajax({ 
         url: window.location, 
         type: 'GET', 
         dataType: 'html', 
         data: {'page': pageNum}, 

         success: function(data) { 
          var $response = $(data); 
          var gcc = $(data).find('.gcc'); 
          commentPart.append(gcc); 
         }, 
         error: function(xhr, textStatus, error){ 
          alert("Invalid request"); 
         } 
        }); 

       }); 
}); 

Answer 1

我建议你使用这个：http://api.jquery.com/load/，它会让你的生活更轻松的方式。而不是在div后追加，你只会用你的ajax请求替换你的父div。希望它有帮助。