Question

我有一些问题。

点击我用ajax旋转图像并保存新图像。一切都没有页面刷新。问题是旧图像不会刷新并刷新新图像。

此外，新图像与旧图像具有相同的名称。

问题

我的问题是如何在没有页面刷新的情况下从文件夹更新img？只有在点击类slika-rotiraj。

之后

HTML：

<div class="slika">
    <div class="slika-obrisi"></div>
    <div class="slika-rotiraj"></div>
    <img src="uploads/87b6f334f30717343acd69f3962142a0_542ad975e424d.jpg" />
</div>

脚本：

$(document).on("click", ".slika-rotiraj", function() {
    var slika = $(this).next("img").attr("src");
    var slika1 = $(this).parent();
    var slika2 = $(this).next("img");
    $(this).next("img").attr("src", slika);
    $.ajax({
        type: "POST",
        url: "rotiraj.php",
        data: {
            slika: slika
        },
        success: function(data) {

        }
    });
});

Answer 1

您的意思是图像已经更改服务器端，您只是想强制img标记获取图像的新状态？只需设置src就可以实现：

success: function(data) {
    // which is your image?  "slika2"?
    // it's not really obvious, so I'll assume that for now
    $(slika2).attr('src', slika);
}

如果没有刷新图像，您可以添加“缓存破坏程序”以强制它重新请求。像这样简单：

success: function(data) {
    $(slika2).attr('src', slika + '?' + new Date().getTime());
}

这不会影响任何事情，只会无意中更改URL并强制浏览器从服务器重新请求。

Answer 2

为您的代码添加ID并设置＆＃39; src＆＃39;的值。在ajax调用的成功函数中的属性。

<强> HTML

<div class="slika">
    <div class="slika-obrisi"></div>
    <div class="slika-rotiraj"></div>
    <img id="myimage" src="uploads/87b6f334f30717343acd69f3962142a0_542ad975e424d.jpg" />
</div>

<强> JS：

$(document).on("click", ".slika-rotiraj", function() {
    var slika = $(this).next("img").attr("src");
    var slika1 = $(this).parent();
    var slika2 = $(this).next("img");
    $(this).next("img").attr("src", slika);
    $.ajax({
        type: "POST",
        url: "rotiraj.php",
        data: {
            slika: slika
        },
        success: function(data) {
            $("#myimage").attr('src', data);
        }
    });
});

Answer 3

如果图像的名称始终相同，请尝试这样的操作：

$('.slika img').attr('src', 'new path to image');

否则：

$('.slika img').attr('src', 'new path to image' + '?_=' + new Date().getTime());

ajax调用后更新图像

3 个答案: