Question

我遇到的问题是，在ajax请求之后，图像元素的src属性保持不变。元素是另一个元素的“内部”元素，它被.html（数据）函数@回调函数“替换”。奇怪的是，即使我说src属性显示源代码中最后一个图像的路径，也会显示新图像。

这是JS：

    $('.toplistimages').each(function(){
    var filepath = $(this).attr('src');
    var next = "next"
    $(this).click(function(e){
        e.preventDefault();
        $.ajax({
            type: 'POST',
            url: '?category=goto',
            data: {
                "filepath" : filepath,
                "next" : next
            },
            success: function(data){
                $('#rightvotecolumn').html(data);
            }
        });
        return false;
    });
});

内容已成功替换，但src属性保持不变。

编辑：当我尝试保存ajax请求之后显示的图像时，我可能还会添加正确的文件名。我在firefox和chrome上尝试这个

Answer 1

我建议您使用Chrome中的F12或Firefox在控制台中查看源代码，而不是通过“查看来源”选项检查源代码。

因为，在页面源中无法看到稍后添加的动态数据。

Answer 2

此类行为的原因是您只获得一次实际src值，并在每个click事件处理程序中使用该值。要解决此问题，请在每个单击事件上设置filename变量值：

$('.toplistimages').each(function(){
var next = "next"
$(this).click(function(e){
    e.preventDefault();
    var filepath = $(this).attr('src');
    $.ajax({
        type: 'POST',
        url: '?category=goto',
        data: {
            "filepath" : filepath,
            "next" : next
        },
        success: function(data){
            $('#rightvotecolumn').html(data);
        }
    });
    return false;
});

}）;

图像更改，src属性保持不变

2 个答案: