ThinKPHP框架+ajax实现图片无刷新上传
2017-03-23 00:33
579 查看
ThinKPHP框架+ajax实现图片无刷新上传
本程序是结合视频教程和百度资料整理出的,以便以后学习和使用:有uploadify扩展包
下载uploadify类包
将之解压放在./Public/js目录下。
前端文件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>无刷新上传</title> <script src="__PUBLIC__/up/jquery.min.js" type="text/javascript"></script> <script src="__PUBLIC__/up/jquery.uploadify.min.js"></script> <link rel="stylesheet" type="text/css" href="__PUBLIC__/up/uploadify.css"> </head> <body> <form action="{:U('inserts')}" method="post" enctype="multipart/form-data"> <p>IMG</p> <div id="imgs"></div> <input id="ups" name="img" type="file"> <input type="hidden" name="img" id="img_post"> <input type="submit" name="" value="提交"> </form> </body> <script type="text/javascript"> var img = ''; $('#ups').uploadify({ 'swf' : '__PUBLIC__/up/uploadify.swf', 'uploader' : '{:U("User/ajax_up")}', 'buttonText' : '缩略图上传', onUploadSuccess : function(file, data, response) { //这个数据返回有点问题,所以这个函数截取的是图片的路径和名字 $("#img_post").val(data.substring(0,28)); img += "<img width='200px' src='/tp2/Uploads/"+data.substring(0,28)+"'>"; $('#imgs').html(img); } }); </script> </html>
2.服务器文件
//模板文件 public function adds(){ $this -> display(); } //上传类 public function ajax_up(){ if(!empty($_FILES)) { $upload = new \Think\Upload(); $images = $upload -> upload(); //判断是否有图 if($images){ $info = $images['Filedata']['savepath'].$images['Filedata']['savename']; echo $info; }else{ $this -> error($upload -> getError()); } } } //把图片信息保存到数据库 public function inserts(){ //没有具体去实现 dump($_POST); }
4000
相关文章推荐
- 在easyui的框架中,使用ajax实现批量上传图片到服务器
- 利用ajax与springmvc传送formdata实现图片的无刷新上传
- thinkPHP5框架整合plupload实现图片批量上传功能的方法
- thinkphp ajaxfileupload实现异步上传图片的示例
- ajaxfileupload.js插件实现图片无刷新上传
- 基于iframe的图片无刷新上传和用ajax生成缩略图和即时删除,封装于thinkphp
- 表单设置action,target指向隐藏的框架,使页面停留在本页,实现无刷新上传图片
- php+ajax无刷新上传图片的实现方法
- ThinkPHP结合AjaxFileUploader实现无刷新文件上传的方法
- bootstrap-wysiwyg结合ajax实现图片上传实时刷新功能
- CI框架怎么使用ajax方式无刷新上传文件/图片
- 原生ajax和iframe框架实现图片文件上传的两种方式
- thinkPHP5.0框架验证码调用及点击图片刷新简单实现方法
- php+ajax无刷新上传图片的实现方法
- ssh 利用ajaxfileupload实现图片无刷新上传
- bootstrap-wysiwyg整合ajaxFileUpload实现图片实时上传刷新
- jquery+ajax+servlet实现无刷新图片上传
- Struts2 +jquery+ajaxfileupload 实现无刷新上传图片
- ThinkPHP结合AjaxFileUploader实现无刷新文件上传的方法
- Ajax无刷新实现图片切换特效(AjaxPro)