在javascript中操作后刷新页面

Posted 2023-02-25

【中文标题】在javascript中操作后刷新页面

【英文标题】：Refresh page after action in javascript

【发布时间】：2013-08-18 01:39:34

【问题描述】：

我有以下代码，可以让用户裁剪他们的图片。我尝试做的是在用户裁剪他的图片后刷新页面，让他看到缩略图预览。但是我试图在每个地方都放一个刷新代码，但刷新永远不会起作用。关于我如何做到这一点的任何想法？ （或者知道我做错了什么？）

编辑：我想做与http://demos.9lessons.info/cropimages/imagecrop.php 相同的操作，但没有确认窗口

 <script type="text/javascript">
 function getSizes(im, obj) 
     var x_axis = obj.x1;
     var x2_axis = obj.x2;
     var y_axis = obj.y1;
     var y2_axis = obj.y2;
     var thumb_width = obj.width;
     var thumb_height = obj.height;
     if (thumb_width > 0) 

         $.ajax(
                 type: "GET",
                 url: "ajax_image.php?t=ajax&img=" + $("#image_name").val() + "&w=" +  thumb_width + "&h=" + thumb_height + "&x1=" + x_axis + "&y1=" + y_axis,
                 cache: false,
                 success: function (rsponse)

            
                     $("#cropimage").hide();
                     $("#thumbs").html("");
                     $("#thumbs").html("<img src='images/" + response + "' />");
                         complete: function() 
                         location.reload(true);
                         
                 

             );

      else
          alert("Please select portion..!");
 
 $(document).ready(function () 
     $('img#photo').imgAreaSelect(
         aspectRatio: '1:1',
         onSelectEnd: getSizes
     );
 );

</script>

【问题讨论】：

抛出任何错误？

好吧，用户裁剪了他的图片，并且在它永远不会刷新到新裁剪的缩略图之后，它总是旧的，直到我手动刷新页面。

@freddy rsponse 是一个错字。如果您请求相同的图像 src，您可能还会遇到缓存问题。您可以简单地向 src url 添加一个随机参数来解决您的问题。

我没有请求相同的图像 src。我只是想找到一种自动刷新页面的方法，因为我想要的可以通过手动刷新来实现......

@freddy，您是否尝试将刷新代码放入您的成功回调中？

【参考方案1】：

将您的页面刷新代码完全回调

示例：

$.ajax(
    type: "GET",
    url: "ajax_image.php?t=ajax&img=" + $("#image_name").val() + "&w=" +  thumb_width + "&h=" + thumb_height + "&x1=" + x_axis + "&y1=" + y_axis,
    cache: false,
    success: function (rsponse) 
        $("#cropimage").hide();
        $("#thumbs").html("");
        $("#thumbs").html("<img src='images/" + response + "' />");
    ,
    complete: function() 
        location.reload(true);
    
);

希望这会有所帮助！

【讨论】：

@freddy，你在错误的地方添加了它，我在我的答案中发布了正确的代码。