效果图:
直接上代码了、
<div class="main-wrap">
<div class="profile">
<p class="logo-line"><label class="label">上传头像:</label><input type="text" name="logo" id="logo" class="txtinput" /><input type="button" value="浏览" onClick="upFile()"><span class="logo"><img src="__PUBLIC__/Admin/images/getAvatar.jpg" id="image" /></span></p>
<p><label class="label">昵称:</label><input type="text" name="" class="txtinput" /></p>
<p><label class="label">性别:</label><label><input type="radio" name="gender" value="0">男</label> <label><input type="radio" name="gender" value="1">女</label></p>
</div>
</div>
<form id="fileUpload" name="fileUpload" method="post" enctype="multipart/form-data" target="frameFile">
<input id="upfile" name="upfile" contenteditable="false" type="file" style="display:none;" onChange="$('#fileUpload').attr('action','__URL__/frameUpload?' + new Date().getTime() );document.fileUpload.submit();" />
</form>
<!-- 实现本页面图片显示 -->
<iframe id="frameFile" name="frameFile" style="display: none;"></iframe>
<script type="text/javascript">
function upFile(){
var isIE=document.all && window.external;
if(!isIE){
document.getElementById('upfile').click();
}
}
function InsertMsgPic($state,imgthumb)
{
if($state=='SUCCESS'){
$('#image').attr('src',imgthumb);
$('#logo').val(imgthumb);
}else{
alert($state);
}
}
</script>
//框架上传
public function frameUpload(){
//配置上传参数
$config = array(
"rootPath"=>'./Uploads/',
"savePath" => $this->savePath,
"maxSize" => 20000000, // 单位B
"exts" => explode(",", 'gif,png,jpg,jpeg,bmp'),
"subName" => $this->sub_name,
);
$upload = new \Think\Upload($config);// 实例化上传类
$info = $upload->upload();
if($info) {
//上传成功 获取上传文件信息
$state = "SUCCESS";
}else{
// 上传错误提示错误信息
$state = "ERROR" . $upload->getError();
}
$file_url = '/Uploads/'.$info['upfile']['savepath'].$info['upfile']['savename'];
header('Content-type: text/html; charset=UTF-8');
echo '<script>window.parent.InsertMsgPic("'.$state.'","'.$file_url.'");</script>';
exit;
}
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。