一、实现图片上传方法一

html的写法:

<form action="handle.php" name="form" method="post" enctype="multipart/form-data">
  <input type="file" name="file" />
  <input type="submit" name="submit" value="上传" />
</form>
 
php后台实现:
$file = $_FILES['file'];//得到传输的数据
//得到文件名称
$name = $file['name'];
$type = strtolower(substr($name,strrpos($name,'.')+1)); //得到文件类型,并且都转化成小写
$allow_type = array('jpg','jpeg','gif','png'); //定义允许上传的类型
//判断文件类型是否被允许上传
if(!in_array($type, $allow_type)){
  //如果不被允许,则直接停止程序运行
  return ;
}
//判断是否是通过HTTP POST上传的
if(!is_uploaded_file($file['tmp_name'])){
  //如果不是通过HTTP POST上传的
  return ;
}
$upload_path = "D:/now/"; //上传文件的存放路径
//开始移动文件到相应的文件夹
if(move_uploaded_file($file['tmp_name'],$upload_path.$file['name'])){
  echo "Successfully!";
}else{
  echo "Failed!";
}
 
二、利用uploadify实现无刷新并且带进度条的上传
首先下载uploadify插件,保存在项目中的某个文件夹下面,然后引入三个文件
link href="js/uploadify/uploadify.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="js/uploadify/jquery.min.1.7.js"></script>
<script type="text/javascript" src=js/uploadify/jquery.uploadify.min.js"></script>
 
然后引用以下代码:
<script type="text/javascript">
    $(function(){
      $(".uploadbutton").each(function(){
        
        bidtype="上传";
        $(this).uploadify({
          swf: 'js/uploadify/uploadify.swf',
          uploader: "handle.php"//处理上传的php文件或者方法
          multi: true//是否开启一次性上传多个文件
          queueSizeLimit:20,  //最大允许上传的文件数量
          buttonText: bidtype,        //按钮文字
          height: 34,               //按钮高度
          width: 82,               //按钮宽度
          auto:false//选择完图片以后是否自动上传
          method:'post',
          fileTypeExts: "*.jpg;*.png;*.gif;*.jpeg;",      //允许的文件类型
          fileTypeDesc: "请选择图片文件",      //文件说明
          postData:{},
          formData: { "imgType": "normal","timestamp":"asdfsa","token":"48f262516b3912a060d21ef6af564668" }, //提交给服务器端的参数
          onUploadSuccess: function (file, data, response) {  //一个文件上传成功后的响应事件处理
            var data = $.parseJSON(data);
          }
        });
      })
    });
  </script>
<body>
  <span id="commercial_upload" class="uploadbutton"></span>
</body>
 
 
 
 
 

   
 
<link href="js/uploadify/uploadify.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/uploadify/jquery.min.1.7.js"></script>
<script type="text/javascript" src=js/uploadify/jquery.uploadify.min.js"></script>

然后引用以下代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<script type="text/javascript">
    $(function(){
      $(".uploadbutton").each(function(){
        
        bidtype="上传";
        $(this).uploadify({
          swf: 'js/uploadify/uploadify.swf',
          uploader: "handle.php"//处理上传的php文件或者方法
          multi: true//是否开启一次性上传多个文件
          queueSizeLimit:20,  //最大允许上传的文件数量
          buttonText: bidtype,        //按钮文字
          height: 34,               //按钮高度
          width: 82,               //按钮宽度
          auto:false//选择完图片以后是否自动上传
          method:'post',
          fileTypeExts: "*.jpg;*.png;*.gif;*.jpeg;",      //允许的文件类型
          fileTypeDesc: "请选择图片文件",      //文件说明
          postData:{},
          formData: { "imgType": "normal","timestamp":"asdfsa","token":"48f262516b3912a060d21ef6af564668" }, //提交给服务器端的参数
          onUploadSuccess: function (file, data, response) {  //一个文件上传成功后的响应事件处理
            var data = $.parseJSON(data);
          }
        });
      })
    });
  </script>
<body>
  <span id="commercial_upload" class="uploadbutton"></span>
</body>

样式如下

当然此按钮的样式我改动过,大家可以根据自己的需要修改样式文件,改变此按钮的样式
同样的php代码 handle.php

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
$file = $_FILES['Filedata'];//得到传输的数据
//得到文件名称
$name = $file['name'];
$type = strtolower(substr($name,strrpos($name,'.')+1)); //得到文件类型,并且都转化成小写
$allow_type = array('jpg','jpeg','gif','png'); //定义允许上传的类型
//判断文件类型是否被允许上传
if(!in_array($type, $allow_type)){
  //如果不被允许,则直接停止程序运行
  return ;
}
//判断是否是通过HTTP POST上传的
if(!is_uploaded_file($file['tmp_name'])){
  //如果不是通过HTTP POST上传的
  return ;
}
$upload_path = "D:/now/"; //上传文件的存放路径
//开始移动文件到相应的文件夹
if(move_uploaded_file($file['tmp_name'],$upload_path.$file['name'])){
  echo "Successfully!";
}else{
  echo "Failed!";
}

以上两种方式上传可以说PHP处理的原理是相同的,只是前台显示的样式不同,第二种方式是无刷新,并且带有返回值,可以方便我们做其它的处理。虽然常用,但是总归会受限制,使用起来不是很灵活。
随着html5的发展的越来越成熟,我们可以利用h5中的一些方法实现上传功能,此时后台PHP的处理代码完全不同于以上两种方式,并且使用起来很灵活。由于篇幅限制,本篇我不向大家介绍这种方式,有兴趣的可以参考php+html5实现无刷新图片上传教程,希望大家会喜欢。

如对本文有疑问,请提交到交流社区,广大热心网友会为你解答!! 点击进入社区

 
Tags:php 图片上传
 

最新评论

评论(0人参与0条评论)

 

来说两句吧...
还没有评论,快来抢沙发吧!

 

php中上传图片,原生代码的更多相关文章

  1. jquery中ajax原生代码的分析模仿

    function ajax(obj){     var defaults = {         url: "#",         data: {},         type: ...

  2. PhoneGap或者Cordova框架下实现Html5中JS调用Android原生代码

    PhoneGap或者Cordova框架下实现Html5中JS调用Android原生代码 看看新闻网>看引擎>开源产品 0人收藏此文章, 发表于8小时前(2013-09-06 00:39) ...

  3. 移动开发中如何整合HTML 5和原生代码

    移动开发中如何整合HTML 5和原生代码 https://blog.csdn.net/lvjin110/article/details/41038565

  4. js原生代码实现轮播图案例

    一.轮播图是现在网站网页上最常见的效果之一,对于轮播图的功能,要求不同,效果也不同! 我们见过很多通过不同的方式,实现这一效果,但是有很多比较麻烦,而且不容易理解,兼容性也不好. 在这里分享一下,用j ...

  5. 新型编译器将原生代码转换为JavaScript

    导读:Emscripten C/C++到JavaScript项目利用来自LLVM的后端构建起更具速度与针对性优势的编译方案. 在当初刚刚公布时,Emsripten听起来完全像是个冲劲十足的技术笑谈:一 ...

  6. ANE原生代码的调试(安卓)

    忙了一天终于有空继续这篇教程了. ANE的原生代码的调试其实在Adobe的官网有介绍的,但是同样很含糊,我摸索了一段时间现在记录下我的心得. 首先你得安装Eclipse,然后你得启动Eclipse 然 ...

  7. Cordova - 与iOS原生代码交互2(使用Swift开发Cordova的自定义插件)

    在前一篇文章中我介绍了如何通过 js 与原生代码进行交互(Cordova - 与iOS原生代码交互1(通过JS调用Swift方法)),当时是直接对Cordova生成的iOS工程项目进行编辑操作的(添加 ...

  8. Cordova - 与iOS原生代码交互1(通过JS调用Swift方法)

    在前面的文章中介绍的了如何使用Cordova进行跨平台应用的开发,使用Cordova的话基本上就不需要在写系统原生代码了,只要通过编写html页面和js方法即可. 但在有些特殊情况下,还是是需要htm ...

  9. ueditor1.3.6jsp版在struts2应用中上传图片报"未找到上传文件"解决方案

    摘要: ueditor1.3.6jsp版在struts2应用中上传图片报"未找到上传文件"解决方案 在struts2应用中使用ueditor富文本编辑器上传图片或者附件时,即使配置 ...

  10. 仿jQuery的siblings效果的js原生代码

    仿jQuery的siblings效果的js原生代码 <previousSibling> 属性返回选定节点的上一个同级节点(在相同树层级中的前一个节点). <nextSibling&g ...

随机推荐

  1. 更改手机系统的User-Agent & okhttp

    okhttp 和 volley 1. 之前用的是volley,其中一部分功能,比如User-Agent,是系统去处理的,改成okhttp库后,这部分功能需要浏览器自己处理 2. 具体区别可以参考: h ...

  2. 增加删除的js

    <!doctype html><html lang="en"> <head>  <meta charset="UTF-8&quo ...

  3. windows云服务器发布项目

    1.tomcat安装版安装,把server.xml中”localhost“改为自己的域名.启动tomcat的时候就通过外网访问到云服务器的tomcat主页. 2.上述实现的前提是已经对域名进行解析:域 ...

  4. frag

    <?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android=&qu ...

  5. git 提交本地工程

    1> 进入github 建立repository 2> 得到git master 地址 3> 得到进入本地工程目录 右键->git bash here 4>执行 以下命令 ...

  6. 数据库关闭,shutdown三种语句。

    1.shutdown normal     正常方式关闭数据库. 2.shutdown immediate     立即方式关闭数据库.     在SVRMGRL中执行shutdown immedia ...

  7. C++动态链接库方法调用

    //定义内存的信息结构 [StructLayout(LayoutKind.Sequential)] public struct MEMORY_INFO { public uint dwLength; ...

  8. 芯灵思Sinlinx A64 开发板移植SQLite3

    开发平台 芯灵思Sinlinx A64 内存: 1GB 存储: 4GB 开发板详细参数 https://m.tb.cn/h.3wMaSKm 开发板交流群 641395230 首先到 http://ww ...

  9. android 位置记录软件

    行者 用的百度高德的方案,没有偏移问题endomondo,咕咚,行者.endomondo是国外软件,运行稳定,但GPS记录漂移比较严重:咕咚的GPS位置记录比较准确,缺点是容易崩溃,譬如记录过程中来个 ...

  10. python通过openpyxl操作excel

    python 对Excel操作常用的主要有xlwt.xlrd.openpyxl ,前者xlwt主要适合于对后缀为xls比较进行写入,而openpyxl主要是针对于Excel 2007 以上版本进行操作 ...