基于Ajaxupload的多文件上传操作

所属分类: 网络编程 / AJAX相关 阅读数: 1586
收藏 0 赞 0 分享

废话不多说了,直接给大家贴代码了,具体代码如下所示:

<pre name="code" class="php"><?php 
$ele = $_GET['ele']; 
$file = $_FILES['thumb_'.$ele]; 
$pathinfo = pathinfo($file['name']); 
$filedir = 'uploads/' . date('Y'); 
if (!is_dir($filedir)) 
{ 
  mkdir($filedir); 
} 
$filedir .= '/' . date('md'); 
if (!is_dir($filedir)) 
{ 
  mkdir($filedir); 
} 
$filedir .= '/' . time() . '_' . mt_rand(1000, 9999) . '.' . $pathinfo['extension']; 
$msg = ''; 
if (!move_uploaded_file($file['tmp_name'], $filedir)) 
{ 
  $msg = '上传失败'; 
} 
$data = array('msg' => $msg, 'filedir' => $filedir); 
sleep(2); 
echo json_encode($data); 
?></pre><br> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gbk" /><title>Ajax上传</title><script 
 src="jquery-1.4.4.min.js" type="text/javascript"></script><script src="ajaxfileupload.js" type="text/javascript"></script><script type="text/javascript">function fileupload( ele ){$("#loading").ajaxStart(function() {jQuery("#photoImg").hide();jQuery(this).show();}).ajaxComplete(function() 
 {jQuery(this).hide();jQuery("#photoImg").show();});$.ajaxFileUpload({url: "index.php?ele="+ele,secureuri: false,fileElementId: "thumb_"+ele,dataType: "json",success: function(data, status) {if(data.msg != '') {alert(data.msg);}else {$("[name='photo_"+ele+"']").val(data.filedir);$("#photoImg_"+ele).attr("src", 
 data.filedir);}},error: function (data, status, e) {alert(e);}})return false;}</script></head><body><!-- 第一个ajax上传 --><input type="file" id="thumb_1" name="thumb_1" onchange="return fileupload('1');" /><div><img src="ajaxLoading.gif" id="loading" style="display: 
 none" /><img src="" id="photoImg_1" width="200px" height="150px" /><input type="text" name="photo_1" size=100/></div><hr/><!-- 第二个ajax上传 --><input type="file" id="thumb_2" name="thumb_2" onchange="return fileupload('2');" /><div><img src="ajaxLoading.gif" 
 id="loading" style="display: none" /><img src="" id="photoImg_2" width="200px" height="150px" /><input type="text" name="photo_2" size=100 /></div><!-- 第二个ajax上传 --><input type="file" id="thumb_2" name="thumb_2" onchange="return fileupload('2');" /><div><img 
 src="ajaxLoading.gif" id="loading" style="display: none" /><img src="" id="photoImg_2" width="200px" height="150px" /><input type="text" name="photo_2" size=100 /></div><a>添加</a></body></html> 
<pre></pre> 
<p><br> 
</p> 
<p><br> 
</p> 
<p><br> 
</p> 
<br> 

以上所述是小编给大家介绍的基于Ajaxupload的多文件上传操作,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

更多精彩内容其他人还在看

ajax中文乱码问题解决方案

ajax中文乱码问题在中文中经常会出现这种问题,其实只要稍加注意就不会出现ajax中文乱码这回事情了,接下来为大家详细介绍下如何解决这类问题
收藏 0 赞 0 分享

jquery ajax实现批量删除具体思路及代码

回调函数,在请求完成后需要进行的操作:此处是把选中的checkbox去掉,接下来为大家详细介绍下,感兴趣的朋友可以参考下哈,希望对你有所帮助
收藏 0 赞 0 分享

JQuery+ajax实现批量上传图片(自写)

jquery+ajax方式实现单张图片上传的代码是可以搜的到,实现批量上传图片的程序却没搜索到于是自己写了个,感兴趣的朋友可以参考下
收藏 0 赞 0 分享

利用Ajax实现在脚本里传值实例介绍

Ajax实现在脚本里传值可以解决实际上的一些问题,本文实现了一下,感兴趣的朋友可以参考下,希望可以帮助到你
收藏 0 赞 0 分享

jQuery+Ajax实现表格数据不同列标题排序(为表格注入活力)

CSS也使得表格的布局越来越光彩耀人。但是,无论如何,都掩饰不了那些包装下的死板,接下来为大家介绍下让那些死板的数据 更具有可读性、可用性
收藏 0 赞 0 分享

jQery ajax——load()方法示例介绍

load(url,[data],[callback])url:加载的页面地址;data: 可选项,发送到服务器的数据,格式是key/value;callback:可选项,回调函数,示例代码如下
收藏 0 赞 0 分享

滑轮滚动到页面底部ajax加载数据配合jsonp实现探讨

滚动下拉到页面底部加载数据是很多瀑布流网站的做法,那来看看配合jsonp是如何实现的吧,小菜总结记录之用特在此与大家一起分享,感兴趣的朋友可以参考下哈
收藏 0 赞 0 分享

ajax 登录功能简单实现(未连接数据库)

未连接数据库下实现ajax 登录功能判断登陆成功与失败,喜欢ajax的朋友可以参考下哈,希望对大家有所帮助
收藏 0 赞 0 分享

AJAX和WebService实现邮箱验证(无刷新验证邮件地址是否合法)

首先在项目里面添加服务引用,验证 Email 地址是否正确(邮件地址合法、只是域名正确、邮件服务器没有找到等等)感兴趣的朋友可以参考下哈
收藏 0 赞 0 分享

AJAX和三层架构实现分页功能具体思路及代码

本文涉及到AJAX和三层架构方面的知识,在学习分页的同时也巩固了一下它们的相关知识,适合初学者的你
收藏 0 赞 0 分享
查看更多