Question

我通过cfcontent电话流式传输我的照片，并且在允许用户将它们旋转90度后尝试刷新图片。在我的主要照片页面中，我有一个精选图片div，一个画廊div和一个照片细节div。在页面加载时，除非存在会话变量，否则feature / gallery div是未填充的，在这种情况下，包含相关模板。如果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>

特色image.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});

在我的$（文件）.ready（）里面，无济于事。图片旋转，如果我刷新整个页面，我可以看到更改，但是ajax调用，虽然它告诉我我已经成功，但没有显示更新的图片。

Answer 1

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

ajax调用后，cfcontent不会刷新

1 个答案: