0

我正在通过 jQuery Ajax 加载一堆内容，现在我想在这个加载的内容中更改一个 img src 属性。

使用.click显然不起作用，以针对我使用的 Ajax 加载的内容.on：

$("#user_list").on('click','.block_user', function(e) {
    e.preventDefault();
    $(this).attr("src", "path_to_img_and_name.png");
});

这工作得很好。图像被替换，当我把这个更改放在一个新的jquery ajax 调用中时，我的问题就出现了：

$("#user_list").on('click','.block_user', function(e) {
    e.preventDefault();

    var bstatus=$(this).attr("bstatus"),
    user_id=$(this).attr("user_id");

    $.ajax({
        url: 'main/change_user_status',
        data: {
            bstatus: bstatus,
            user_id: user_id
        },
        type:'POST',
        dataType: 'json',
        success: function(output){
            $(this).attr("src", "images/"+output+"_block_user.png");
            $(this).attr("bstatus", output);
        }
    });
});

这根本行不通。

  • AJAX 调用转成功。
  • 范围是正确的，我的 img 的路径也是正确的。
  • 仅当我的 click 函数有 AJAX 调用时才会发生这种情况

似乎原始内容正在以某种方式重新加载，有人知道吗？

4

2 回答 2

1

您的问题是 $(this) 选择器的范围。你可以使用这样的东西

$("#user_list").on('click','.block_user', function(e) {
e.preventDefault();

var bstatus=$(this).attr("bstatus"),
user_id=$(this).attr("user_id");

var elem = $(this)

$.ajax({
    url: 'main/change_user_status',
    data: {
        bstatus: bstatus,
        user_id: user_id
    },
    type:'POST',
    dataType: 'json',
    success: function(output){
        elem.attr("src", "images/"+output+"_block_user.png");
        elem.attr("bstatus", output);
    }
});
});
于 2013-01-31T15:39:24.213 回答
0

使用决定回调内部值的context属性：$.ajax()thissuccess

$.ajax({
    url: 'main/change_user_status',
    context: this, // here 'this' refers to the #user_list that was clicked
    ...
    success: function(output) {
        // here 'this' refers to what we set as 'context'
        $(this).attr("src", "images/"+output+"_block_user.png");
        $(this).attr("bstatus", output);
    }
});

http://api.jquery.com/jQuery.ajax/ - 向下滚动一点阅读context

于 2013-01-31T15:41:34.670 回答