您的位置：首页 > Web前端 > JQuery

利用Jquery ajaxfileupload插件+PHP 进行文件的上传

2015-02-05 11:34 225 查看
1前端js：

<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="ajaxfileupload.js" type="text/javascript"></script>
<pre name="code" class="javascript"><script type="text/javascript">
$(function () {
$(":button").click(function () {
ajaxFileUpload();
})
})
function ajaxFileUpload() {
$("#error").text("");
var file=$("#file1").val();
if(file!=""&&file.substr(-4)=='xlsx'){//对格式的判断
$("#mask1").css("height", $(document).height());
$("#mask1").css("width", $(document).width());
$("#mask1").css("top", "0px");
$("#mask1").css("left", "0px");
$("#mask1").show();//对加载图片的实现
$.ajaxFileUpload
(
{
url: '2.php', //用于文件上传的服务器端请求地址
secureuri: false, //是否需要安全协议，一般设置为false
fileElementId: 'file1', //文件上传域的ID 也就是<input type="file" id="file1" name="file" />
dataType: 'json', //返回值类型
success: function (data)  //服务器成功响应处理函数
{
$("#content").html("<strong>"+data.filename+"上传"+data.error+"</strong>");
},
error: function (data, status, e)//服务器响应失败处理函数
{
alert(e);
}
}
)
}else{

$("#error").text("Upload file is incorrect");

}
return false;
}
</script>
2 前端html

<body>
<p><input type="file" id="file1" name="file" /></p>
<input type="button" value="上传" />
<div id="content">
<div id="mask1">
<table width="30%" class="mt" style="border:0px;margin-top:15%;" align="center">
<tr>
<td align="center" style="text-align:center;"><img src="load.jpg"/></td>
</tr>
</table>
</div>
</div>
<div id="error" style="color:red;margin-left: 25px;width:50%;"></div>
</body>


3 后台PHP 代码

<?php
$file_tmp_name=$_FILES['file']['tmp_name'];// 服务器端的临时文件名
$file_name=$_FILES['file']['name'];//文件名字 可以对文件名字进行加密 然后再执行move_uploaded_file
$falg=move_uploaded_file($file_tmp_name,"uploads/".$file_name);//在你的project下面建立uploads文件夹
if($falg){
$error="success";
}else{
$error="failed";
}
$row=array(
"error"=>$error,
"filename"=>$file_name,
"filetempname"=>$file_tmp_name
);
echo json_encode($row);
?>



                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航