主要利用 form 的 target 属性，在提交表单之后 response 返回到 iframe 中
form 的 action 可以自己写，也可以直接利用 富文本编辑器的接口实现上传
1 <form id="form_img" method="post" action="/Ueditor/net/controller.ashx?action=uploadimage" enctype="multipart/form-data" target="target_img"> 2 ????????<div>选择图片封面：</div> 3 ????????<input id="img_file" accept="image/*" name="upfile" type="file" /> 4 ????????<input name="submit" value="上传" type="submit" /> 5 ????</form> 6 ????<iframe id="target_img" name="target_img" style="display:none"></iframe> 7 ????<img id="pre_img" src="/Manage/images/no_face.gif" style="width:240px;height:155px" /> 8 ?9 ????<script>10 11 ????????$(function ($) {12 ????????????var result;13 ????????????//这里注意 jquery 的版本14 ????????????$("#target_img").load(function () {15 ????????????//$("#target_img").on(‘load‘, function () {16 ????????????????result = $(this);17 ????????????????//console.log(result[0].contentDocument.body.textContent);18 ????????????????var ans = JSON.parse(result[0].contentDocument.body.textContent);19 ????????????????if (ans["state"] == "SUCCESS") {20 ????????????????????alert("上传成功");21 ????????????????????$("#pre_img").attr("src", "/Uploads/" + ans["url"]);22 ????????????????????//结果保存在 父窗口的控件中23 ????????????????????$(‘#face_img‘, parent.document).val("/Uploads/" + ans["url"]);24 ????????????????}25 ????????????????else {26 ????????????????????alert("上传失败请重试！");27 ????????????????}28 ????????????});29 ????????});30 ????</script>使用 form 和 iframe 实现图片上传回显
原文地址：https://www.cnblogs.com/TianyuSu/p/10363746.html