设为首页
收藏本站
用户名
Email
自动登录
找回密码
密码
登录
立即注册
只需一步,快速开始
快捷导航
登录
注册
论坛首页
BBS
建站模版
微站设计
虚拟主机
企业邮箱
博客日志
Blog
搜索
搜索
搜索
热搜
长春
优惠
活动
做网站
本版
帖子
用户
本版
帖子
用户
请
登录
后使用快捷导航
没有帐号?
立即注册
道具
勋章
任务
留言板
设置
我的收藏
退出
时时商务社区
»
论坛首页
›
建站资源
›
建站技术
›
php+ajax实现图片文件上传功能实例
返回列表
查看:
658
|
回复:
0
php+ajax实现图片文件上传功能实例
[复制链接]
bewin83
当前离线
积分
7520
2500
主题
2513
帖子
7520
积分
论坛元老
论坛元老, 积分 7520, 距离下一级还需 9992479 积分
论坛元老, 积分 7520, 距离下一级还需 9992479 积分
积分
7520
发消息
电梯直达
楼主
发表于 2018-2-14 05:57:35
|
只看该作者
|
倒序浏览
|
阅读模式
目前常用的异步文件上传功能有几种,比较多见的如使用iframe框架形式,ajax功能效果,以及flash+php功能,下面介绍ajax与iframe实现异步文件上传的功能的例子。
方法一,利用jquery ajaxfileupload.js实现文件上传
其实就是实现无刷新式的文件上传。可采用IFRAME文件上传原理。
实际上在用PHP上传文件时。。。只能用$_FILES形式,但是若我们只是单一的用JS方式取其ID,如
..document.getElementById('img').value或者jquery形式的$("#img")都是不能正真实际上传的(但是还是有很多人这样做,刚开始时我也是)。
可是功能上又要要求实现所谓的“异步上传”,怎么办呢?只能借助于第三方的组件,或者自己写一个(在网页里嵌入一个IFRAME)。但如果是考虑开发时间,建议用第三方的,这里有一个不错的jQuery 的Ajax文件上传的组件,即“ajaxfileupload.js",其组件下载地址为:
http://files.jb51.net/file_images/article/201306/js/ajaxfileupload.js
过程:
(1 )前端文件的代码: test.php
[U]复制代码[/U] 代码如下:
相应的HTML为:
Upload
这样客户端就完成了。
(2) 在服务器端的doajaxfileupload.php
此处为了简便的检测是否真正的传值过来了,你可以将它存起来了。
[U]复制代码[/U] 代码如下
file_infor = var_export($_FILES,true);
file_put_contents("d:file_infor.php".$file_infor);
这样你打来刚生成的file_infor.php文件时,你又看到了熟悉的信息了:
[U]复制代码[/U] 代码如下:array(
'name'=>'lamp.jpg',
'type'=>'image/pjpeg',
'tmp_name'=>'c:windowstempphpFA.tmp',
'error'=>0,
'size'=>3127
)
当然,真正的处理类于这样的:
[U]复制代码[/U] 代码如下:'上传失败');
}else{
echo json_encode('file_infor'=>'上传成功');
}
?>
方法二,利用iframe框架上传图片
html代码如下:
[U]复制代码[/U] 代码如下:
index.js文件:
[U]复制代码[/U] 代码如下
(function(){
$("#upload_file").change(function(){
$("#uploadFrom").submit();
});
});
function stopSend(str){
var im="
";
$("#msg").append(im);
}
upload.php文件:
[U]复制代码[/U] 代码如下:
方法三,原生态ajax文件上传
[U]复制代码[/U] 代码如下:
Html5 Ajax 上传文件
.txt{ height:28px; border:1px solid #cdcdcd; width:670px;}
.mybtn{ background-color:#FFF; line-height:14px;vertical-align:middle;border:1px solid #CDCDCD;height:30px; width:70px;}
.file{ position:absolute; top:0; right:80px; height:24px; filter:alpha(opacity:0);opacity: 0;width:260px }
图片
浏览...
上传
php代码:
[U]复制代码[/U] 代码如下:
您可能感兴趣的文章:
jQuery Ajax文件上传(php)
php ajax无刷新上传图片实例代码
使用ajaxfileupload.js实现ajax上传文件php版
PHP+ajaxfileupload+jcrop插件完美实现头像上传剪裁
PHP+jQuery+Ajax实现多图片上传效果
ThinkPHP结合AjaxFileUploader实现无刷新文件上传的方法
php+html5+ajax实现上传图片的方法
File, FileReader 和 Ajax 文件上传实例分析(php)
PHP结合jQuery插件ajaxFileUpload实现异步上传文件实例
php+ajax实现无刷新文件上传功能(ajaxuploadfile)
分享到:
QQ好友和群
QQ空间
腾讯微博
腾讯朋友
收藏
0
回复
使用道具
举报
返回列表
高级模式
B
Color
Image
Link
Quote
Code
Smilies
您需要登录后才可以回帖
登录
|
立即注册
本版积分规则
发表回复
回帖后跳转到最后一页
用户反馈
客户端