您的位置:首页 > 其它

form + iframe 获取表单提交后返回的数据

2017-07-07 17:58 531 查看
原理:

  submit 提交表单没有回调函数,但是可以用iframe来接收返回结果,最后进行格式转换就ok了;

原文地址: http://blog.csdn.net/simeng_1016/article/details/48008359
html: 部分代码

<form id="form_addcompress" action="/rest/upload" method="post" enctype="multipart/form-data" target="uploadframe">
<em class="color-red">* </em>版本:<input type="text" class="txt" name="version" placeholder="如V1.0.0"><br/>

<em class="color-red">* </em>加缓存:<input type="radio" id="cache_no" name="cache" value="0" checked=""><label for="cache_no">否</label>
<input type="radio" id="cache_yes" name="cache" value="1" class="ml"><label for="cache_yes">是</label><br>

<em class="color-red">* </em>文件:<input type="file" class="txt" name="uploadedFile" size="50" /><br>

版本描述:<textarea class="tarea" name="desc" style="height:60px"></textarea><br>
<input type="button" class="btn" value="上传文件" id="upload_compressFile"/>
</form>
<iframe id="uploadframe" name="uploadframe" style="display:none"></iframe></div>


js: 部分代码

var time_index=0;
$('#upload_compressFile').on('click',function(event){
var $c_version=$('#form_addcompress input[name="version"]'),
$c_uploadedFile=$('#form_addcompress input[name="uploadedFile"]');
var c_version=$c_version.val(),
c_uploadedFile=$c_uploadedFile.val();
if(c_version==""){
$c_version.css('borderColor','red');
}else{
$c_version.css('borderColor','#e1e1e1');
}
if(c_uploadedFile==""){
$c_uploadedFile.css('borderColor','red');
}else{
$c_uploadedFile.css('borderColor','#e1e1e1');
}
if(c_version==""||c_uploadedFile==""){
return false;
}
$('#form_addcompress').submit();
time_index=0;
var timeSet=setInterval(function(){
time_index++;
var iframeObj = $(window.frames["uploadframe"].document);
var val=iframeObj.find("body").html();
if(val!=""&&time_index<5){
var _result=eval("(" + val + ")");
if(typeof _result.code!="undefined"&&_result.code=="0"){
clearInterval(timeSet);
return false;
}else{
$.modaldialog.smallTip("上传失败", {
x: event.pageX,
y: event.pageY
});
clearInterval(timeSet);
}
}else{
clearInterval(timeSet);
}
},1000);
});


注意关键点:

form表单中的target=”uploadframe“与iframe中的id=”uploadframe“要一致;原因:target 指 form表单提交后返回结果要放的位置;

$(window.frames[“uploadframe”].document).find(“body”).html()结果是form提交后的返回值,用循环来取值;

_result 就是 返回后的json对象,可以直接获取想要的数据
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: