如何以ajax方式更改dom元素，而不使用javascript方式替换dom内容

默认情况下，页面将显示

向上投票按钮

用户单击“向上”按钮后，页面将再次重新加载，然后显示“向下投票”按钮

现在我想用Ajax的方式，不用加载页面

但是我如何在不重新加载页面的情况下更改按钮呢

  - if not comment.has_evaluation?(:votes, current_user)
    = link_to vote_comment_path(comment, type: "up"), method: :post do
      %button.btn.btn-xs.btn-success
        Like this
  - else
    = link_to vote_comment_path(comment, type: "down"), method: :post do
      %button.btn.btn-xs.btn-danger
        Unlike this

---

我假设您使用背景图像来控制

向上投票

和

向下投票

按钮。试试这个：

var $btn = $('#btn-id');
$.ajax({
    url: '/rate',
    data: {key: value},
    type: 'post'
}).done(function(res) {
    if (res.success) {
       if (res.myRate.up) {
           $btn.removeClass('down-vote-bg');
           $btn.addClass('up-vote-bg');
       } else {
           $btn.removeClass('up-vote-bg');
           $btn.addClass('down-vote-bg');
       }
    }
}).fail(function() {
    alert('Action failed');
});

查看更多信息