您的位置:首页 > 其它

上传文件点击后显示图片

2016-11-30 17:16 393 查看
HTML代码



<include file="./Application/Home/View/default/Public/homeheader.html" />
<html>
<body>
<!--<form action="{:U('home/statistics/uploadinformation')}" method="post" enctype="multipart/form-data">
<label for="file">Filename:</label>
<input type="file" name="file" id="file"/>
<br />
<input type="submit" name="submit" value="上传" />

</form>!-->
<form action="{:U('home/setting/upload')}" method="post" enctype="multipart/form-data">
<div style="width: 100%;height: 100%;">
<div><strong>代理信息上传:</strong></div>
<div class="form-group">
<a class="button input-file" style="text-align: center;vertical-align: middle;" href="javascript:void(0);">上传合同文件<input  size="80" type="file" name="file1" id="file1" onchange="check1()" /></a><!--//显示合同!-->
<a class="button input-file" style="text-align: center;vertical-align: middle;" href="javascript:void(0);">上传证件图片<input  size="80" type="file" name="file2" id="file2" onchange="check2()" /></a><!--//显示证件!-->
<button class="button bg-main" type="submit" name="submit" style="text-align: center;vertical-align: middle;" >确定上传</button>
</div>
<div><p id="f1name"></p></div>
<div><p id="f2name"></p></div>
<br>
<a id="changemouse1" class="dialogs" data-toggle="click" data-target="#mydialog1" data-width="40%" onmouseover="changemouse()" onmouseout="defaultmouse()">查看合同</a><br>
<a id="changemouse2" class="dialogs" data-toggle="click" data-target="#mydialog2" data-width="40%" onmouseover="changemouse()" onmouseout="defaultmouse()">查看证件</a>
</div>
</form>

<div id="mydialog1"><!--点击时弹出窗口,显示合同图片!-->
<div class="dialog">
<div class="dialog-head">
<span class="close rotate-hover"></span><strong>查看合同</strong>
</div>
<div style="text-align: center;vertical-align: middle" class="dialog-body"><img style="height:70%" width="100%" src="{$addr1}"></div>
<div class="dialog-foot">
<button class="button bg-green dialog-close">确认</button>
</div>
</div>
</div>
<div id="mydialog2"><!--点击时弹出窗口,显示合证件图片!-->
<div class="dialog">
<div class="dialog-head">
<span class="close rotate-hover"></span><strong>查看证件</strong>
</div>
<div style="text-align: center;vertical-align: middle" class="dialog-body"><img style="height:70%" width="100%" src="{$addr2}"></div>
<div class="dialog-foot">
<button class="button bg-green dialog-close">确认</button>
</div>
</div>
</div>

<script>
function changemouse() //鼠标移过去变成手形
{
var obj1 = document.getElementById("changemouse1");
var obj2 = document.getElementById("changemouse2");
obj1.style.cursor = 'pointer';
obj2.style.cursor = 'pointer';
}
</script>
<script>
function defaultmouse()//鼠标移回,回复默认
{
var obj1 = document.getElementById("changemouse1");
var obj2 = document.getElementById("changemouse2");
obj1.style.cursor = 'default';
obj2.style.cursor = 'default';
}
</script>
<!--
<script>
function display()
{
var obj = document.getElementById("demo")
{
obj.style.display="";
}

}

</script>
!-->
<script>
function check1()//检查图片格式
{

var filepath=file1.value ;
filepath=filepath.substring(filepath.lastIndexOf('.')+1,filepath.length);
if(filepath != 'jpg' && filepath != 'gif'&& filepath != 'png'&& filepath != 'jpeg')
alert("只能上传JPG,GIF,PNG或者JPEG格式的图片");
else document.getElementById("f1name").innerText=file1.value;

}
</script>
<script>
function check2()
{

var filepath=file2.value ;
filepath=filepath.substring(filepath.lastIndexOf('.')+1,filepath.length);
if(filepath != 'jpg' && filepath != 'gif'&& filepath != 'png'&& filepath != 'jpeg')
alert("只能上传JPG,GIF,PNG或者JPEG格式的图片");
else document.getElementById("f2name").innerText=file2.value;

}
</script>

</body>
</html>


PHP代码



public function upload()
{
if (isset($_POST['submit']))
{

import('Think.Verify.Upload');
// $imagea = new Image();
$picture = new Upload() ; // 实例化上传类
$picture->maxSize = 3145728;// 设置附件上传大小
$picture->exts = array('jpg', 'gif', 'png', 'jpeg');// 设置附件上传类型
$picture->rootPath = './Uploads/';// 设置附件上传根目录
$picture->savepath = ''; // 设置附件上传(子)目录
$info = $picture->upload();// 上传文件

if(!($info['file1']&&$info['file2']))
{
echo "<script>alert('请上传文件')</script>";
}
// $fr = './Uploads/'; //错误http://localhost/use/index.php/home/user/Uploads/2016-11-14/5829803394673.jpg
// $fr = 'Uploads/'; //错误http://localhost/use/index.php/home/user/Uploads/2016-11-14/582980519743a.jpg
// $fr = '/Uploads/'; //错误http://localhost/Uploads/2016-11-14/5829807535c04.jpg
$fr = '/user/Uploads/';//正确 http://localhost/user/Uploads/2016-11-14/582963ff2640f.jpg // $addr1 = $fr . $info['file1']['savepath'] . $info['file1']['savename'];
// $addr2 = $fr . $info['file2']['savepath'] . $info['file2']['savename'];
$user = M('user_admin');// 实例化User对象
// 更改用户的certificate_address和contract_address的值
$upload_role_id_address = array('certificate_address' => $fr.$info['file2']['savepath'].$info['file2']['savename'], 'contract_address' => $fr.$info['file1']['savepath'].$info['file1']['savename']);
$name = $_SESSION['adminid'];//获取SESSION的账户名 $_SESSION['adminid'],$_SESSION['pwd'],$_SESSION['loginkey'],
$where['admin'] = $name;//判断条件实例化
$user->where($where)->setField($upload_role_id_address);
// $addr1 = $upload_role_id_address['contract_address'];
// $addr2 = $upload_role_id_address['certificate_address'];
// $this->assign('addr1',$addr1);
// $this->assign('addr2',$addr2);
//echo "<img src='$addr1'>";die();
$image1 = new \Think\Image();
$image2 = new \Think\Image();
$image1->open('./Uploads/'.$info['file1']['savepath'].$info['file1']['savename']);
$image2->open('./Uploads/'.$info['file2']['savepath'].$info['file2']['savename']);

$image1->thumb(800, 600,\Think\Image::IMAGE_THUMB_FIXED)->save('./Uploads/contract.jpg');//固定缩略图
$image2->thumb(800, 600,\Think\Image::IMAGE_THUMB_FIXED)->save('./Uploads/certificate.jpg');//固定缩略图
// $image1->thumb(150, 150)->save('./Uploads/contract.jpg'); //按比例缩放
// $image2->thumb(150, 150)->save('./Uploads/certificate.jpg');
echo "<script>alert('信息上传成功')</script>";
$addr1= $fr.'contract.jpg';
$addr2= $fr.'certificate.jpg';

/*   echo " <div class=\"form-group\" style=\"float: right\">//文件预览功能
<div><strong>文件预览:</strong></div>
<table>
<tr>
<td><img src='$addr1'></td>
<td><img src='$addr2'></td>
</tr>
</table>
</div>";//显示合同
*/
//echo "<img src='$addr2'>";//显示证件
$this->assign('addr1',$addr1);
$this->assign('addr2',$addr2);
}

$this->display();
} //修改

另外在当前文件夹建立个Upload文件夹,不然没法上传图片。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: