Question

我有一个像这样动态分配id的表格单元格，

    <tbody>
      {% for item in thread_model %}
      <tr>
       .....
        <td id="{{ item.id }}" class='btn vote_up'>{{ item.id }} Vote Up</td>
        <td id="{{ item.id }}" class='btn vote_down'>{{ item.id }} Vote Down</td>
        <td id="voted{{ item.id }}">{{ item.vote }}</td>
        ........
      </tr>
      {% endfor %}
    </tbody>

这很好用，然后我有一点调用Django视图的ajax。但后来我希望设置该单元格的innerHTML。但是我如何让jQuery将innerHTML放入表格单元格中，其中id与我按下的投票行相同？

$(document).ready(function() {
  $('.vote_up').on('click', function() {
    $.get("/vote_up/" + this.id + "/", function(data) {
      $('#voted' + this.id).innerHTML = data;
    });
  });
  $('.vote_down').on('click', function() {
    $.get("/vote_down/" + this.id + "/", function(data) {
      $('#voted' + this.id).innerHTML = data;
    });
  });
});

网址，

url(r'^vote_up/(?P<id>\d+)/$', home.vote_up, name='vote_up'),
url(r'^vote_down/(?P<id>\d+)/$', home.vote_down, name='vote_down'),

视图看起来像这样，

def vote_up(request, id):
    posts = PostModel.objects.get(pk = id)
    posts.vote += 1
    PostModel.objects.filter(pk=id).update(vote=posts.vote)
    return HttpResponse(posts.vote, content_type="text/plain")

def vote_down(request, id):
    posts = PostModel.objects.get(pk = id)
    posts.vote -= 1
    PostModel.objects.filter(pk=id).update(vote=posts.vote)
    return HttpResponse(posts.vote, content_type="text/plain")

由于

Answer 1

this.id undefind位于$.get内。所以你应该像这样改变你的代码

$(document).ready(function() {
      $('.vote_up').on('click', function() {
        var id = this.id;
        $.get("/vote_up/" + id + "/", function(data) {
          $('#voted' + id).html(data);
        });
      });
      $('.vote_down').on('click', function() {
        var id = this.id;
        $.get("/vote_down/" + id + "/", function(data) {
          $('#voted' + id).html(data);
        });
      });
    });

Answer 2

您可以使用Jquery addClass()方法动态地将类分配给元素。

示例：

$("#ID").addClass("selected");

或者如果您只想添加样式和元素，可以使用css()方法

示例：

$("#ID").css( "color", "red" );

希望这可以帮到你

使用jQuery

2 个答案: