Question

怎么用ajax 提交上传的文件上传后在界面显示出来。但界面不刷新

上传图片的后 但整个界面不刷新。仅仅图片哪个部门刷新。有什么比较详细的办法么！
我现在使用的是from 提交。提交后整个界面都刷新 所以想办法不是整个刷新界面。速度来。处理整个问题已经快1周了
我要的是ajax 提交。 你这个是隐藏表单 提交 。这个我用过。后续解决不了。没提交后的结果提示

Answer 1

1. 页面加入隐藏iframe，假如name=xxxx
2. form的target设置成xxxx
3. 后台上传图片后，向前端输出一个函数如：parent.yourfunc('图片url')
4. 页面上定义yourfunc函数，参数为url
5. 图片上传完成后，会调用yourfunc函数
6. 在yourfunc中拿到url，下步你该知道怎么做了吧

追问

用了。后台上传图片后是不刷新了。而且显示了图片但没提示。 前端输出一个函数parent.yourfunc("图片url")是干什么的 有qq没聊下

追答

回调函数，调用父窗口函数，用于传送图片url到父页面上供你处理。

追问

提交后隐藏表单 里面是这样的一个提示。但我主窗口 没任何提示怎么处理

追答

以上iframe里面的内容是后台输出的。

现在要实现你需要的功能，需要后台配合来做，在你的主页面定义好一个函数如 yourfunc，
后台处理完数据后，输出parent.yourfunc('图片url')，就ok了，到时候会自动调用yourfunc

如果你不能要求修改后台的话，那就没有办法了

Answer 2

不知道你是 临时预览图片还是实际是上传了。
如果是临时预览的话，给你提供一个方法。
//预览图片
function lookimg(upfile){
if (navigator.userAgent.indexOf("MSIE") > 0) {
try {
if (!upfile.value.match(/.jpg|.gif|.jpeg|.png|.bmp/i)) {
alert('请上传.jpg|.gif|.jpeg|.png类型的图片');
return false;
}
var objPreview = document.getElementById("img_"+upfile.id);
var objPreviewFake = document.getElementById('result_'+upfile.id);
objPreview.src = upfile.value;
objPreview.onreadystatechange = function(){
if(objPreview.readyState == "complete"){
if(objPreview.fileSize>1024*1024){
alert('文件超过1MB');
return false;
}
}
}
if (objPreviewFake.filters) {
upfile.select();
var imgSrc = document.selection.createRange().text;
objPreviewFake.filters.item('DXImageTransform.Microsoft.AlphaImageLoader').src = imgSrc;
objPreviewFake.style.width = 180 + 'px';
objPreviewFake.style.height = 180 + 'px';
objPreview.style.display = "none";
upfile.blur();
$('#result_'+upfile.id).css('display','block').css('margin-bottom','-25px');
}
} catch (ex) {}
}else if (isFirefox = navigator.userAgent.indexOf("Firefox") > 0) { //FireFox浏览器
if (!upfile.value.match(/.jpg|.gif|.jpeg|.png|.bmp/i)) {
alert('请上传.jpg|.gif|.jpeg|.png类型的图片');
return false;
}
var o = document.getElementById(upfile.id);
var p = document.getElementById("img_"+upfile.id);
if(o.files[0].fileSize>1024*1024){
alert('文件超过1MB');
return false;
}
p.src = o.files[0].getAsDataURL();
//p.style.display = "block";
}
$('#upload_'+upfile.id).attr('disabled','');
}

html:
<img style=" height:85px; width:95px" id="img_f0" src="/images/nopic.jpg">
<br><br>
<input type="button" class="yy_but" id="file" value="上传logo">
<input type="file" hidefocus="" onchange="lookimg(this)" onmouseover="javascript:$('#f0').css('cursor','pointer');" size="4" name="thumb" id="f0" style="cursor: pointer;">
如果是真的上传了，那就结合flash做。