iframe 无刷新上传图片以及返回值

标签：

后台php代码返回获取内容的值

$imginfo = $upload->getUploadFileInfo ();
			$wall_img = $imginfo [0] [‘savepath‘] . $imginfo [0] [‘savename‘];
			$array=array(
				‘wall_img‘=>$wall_img,
			);
			echo ‘<script type="text/javascript">  
					window.parent.setVal("‘.$wall_img.‘");
					</script> ‘;

在前端

 <iframe name="ajaxUpload" style="display:none" id="pic_url"></iframe>

                            
                            <form name="from1" id="from1" method="post" action="index.php?g=Wap&m=Store&a=put_wall_img"  enctype="multipart/form-data" target="ajaxUpload"> 
                            <input type="button" data-inline="true" value="&nbsp;&nbsp;上传图片&nbsp;&nbsp;"  onclick=‘file_upload.click();‘>
                            <input type="file"  value="&nbsp;&nbsp;上传图片&nbsp;&nbsp;"  name="file_upload" id="file_upload" style="display:none" data-role="none">
                            </form>

JS代码处理

$("#file_upload").change(function(){
		$("#from1").submit();	
		setTimeout(‘goto_bottom()‘, 500) ;
	});
	function setVal(val){
		 var $li = $(
		    		‘<div class="content_one"><img src="‘+$(‘#img1‘).val()+‘" class="content_one1"><div style="position:relative; overflow:hidden;"><img src="" id="pic_wall_list" style="max-width:50%; border:#CCC 1px solid; margin-left:3%"><input data-role="none" type="button" value="点击发送图片" class="content_send"></div> </div>‘
		            ),
		     $img = $li.find(‘#pic_wall_list‘);
		    // $list为容器jQuery实例
		    $(‘.msg‘).append($li);
		    $img.attr( ‘src‘, val );
		    $li.find(".content_send").click(function(){
				var _this=this;
				$.ajax({
					url:"index.php?g=Wap&m=Store&a=do_put_wall_img",
					type:"post",
					dataType:"json",
					data:"pic_url="+val,
					success:function(data){
						if(data=="success"){
							$(_this).val("发送成功");
							$(_this).css(‘color‘,‘green‘);
							$(_this).unbind("click"); 
						}
					}
				});
		});
	}

iframe 无刷新上传图片以及返回值

标签：

原文地址：http://my.oschina.net/u/576119/blog/481346