jquery - ajax 调用后 cfcontent 不刷新

Question

我正在通过 cfcontent 调用流式传输我的图片，并尝试在允许用户将图片旋转 90 度后刷新图片。在我的主照片页面中，我有一个特色图片 div、一个图库 div 和一个照片详细信息 div。页面加载时，特色/图库 div 不会填充，除非存在 session 变量，在这种情况下会包含相关模板。如果 div 未填充，单击导航栏菜单会触发 ajax 调用以加载所选图片。

这一切都运行良好。我的问题是当选择并加载图片时，以及当用户想要旋转它时。旋转按钮触发调用以旋转并保存图片(有效)，然后尝试刷新特色/图库 div 以显示更新的图片。这就是它破裂的地方。虽然图片被旋转，并且刷新整个页面会以更新后的形式显示它，但 ajax 调用不会显示更新后的图片。当附加到其他事件处理程序时，这些刷新调用已成功使用，因此我认为它们没有被错误地调用。使用 cfcontent 是否有什么神秘之处？

这是我隔离相关位的尝试:

主页:

<div id="featured_pic">
  <cfif isDefined('session.currentPhotoName') and #session.currentPhotoName# neq "">
    <cfinclude template="featuredImage.cfm">
  </cfif>
</div>

<div id="gallery_container">
  <cfif isDefined('session.category') and isDefined('session.param') 
    and #session.category# neq "" and #session.param# neq ""
  > 
    <cfinclude template="photoGallery.cfm">
  </cfif>
</div>

特色图片.cfm:

<cfif isDefined('url.file_name')>
  <cfset session.currentPhotoName = #url.file_name#>
</cfif>

<cfoutput>
  <cfset thisImage = #session.currentPhotoName#>    
  <img 
    id="photoPlaceholder"
    src="/#application.root_name#/administration/PhotoManagement/displayPhoto.cfm?thisImage=#thisImage#" 
    width="600px" 
  />
</cfoutput>

DisplayPhoto.cfm:

<cfcontent 
  type = "image/*" 
  file = "C:\#replace(application.local_file_path, '/', '')#\Photos\#thisImage#" 
  deleteFile = "No"
>

以及实现它的 js(包含在 $(document).ready() 中):

$('#rotate').live('click', function(){
    var id = $('#docID').val();
    var title = $('#title').text();
    title = $.trim(title);

    // rotate the image and refresh the details container   
    $('#details_container').load('Administration/PhotoManagement/photoDetails.cfm', {'DOC_ID': id, 'title': title, 'rotateFlag': true}, function(response, status, xhr) {
        if (status == "error") {
            var msg = "Sorry but there was an error: ";
            $("#details_container").html(msg + xhr.status + " " + xhr.statusText);
        }
    });

    // refresh the gallery
    var category = $('#currentCategory').val();
    var param = $('#currentParam').val();
    $.get(
        'Administration/PhotoManagement/photoGallery.cfm', 
        {category:category, param:param},
        function(response, status, xhr){
            if (status == "error") {
                var msg = "Sorry but there was an error: ";
                $("#photos").html(msg + xhr.status + " " + xhr.statusText);
            } else {
                $('#gallery_container').html(response);
            }
        }
    );

    // refresh the featured image
    $('#featured_pic').load('Administration/PhotoManagement/featuredImage.cfm',
        {'file_name': title});

}); 

请注意，作为 ajax 的新手，我一直在尝试使用 .load()、.get() 和 .ajax() 来看看效果如何。从 jQuery In Action 中，我发现我应该使用 GET 来执行这些操作，对吗？

编辑:根据下面的建议，我尝试将其称为:

$.ajax({url:'Administration/PhotoManagement/featuredImage.cfm',
        cache: false,
        data: {file_name: title},
        success: function(response){
            $('#featured_pic').html(response);
            alert('success');
        }
    });

我也尝试过设置

$.ajaxSetup({ cache: false});

在我的 $(document).ready() 中，无济于事。图片旋转，如果我刷新整个页面，我可以看到变化，但是ajax调用，虽然它告诉我已经成功，但没有显示更新的图片。

Answer 1

使用 Get 方法的 Ajax 请求会被缓存。附加虚拟时间参数或使用 Post 请求。