一、实现图片上传方法一

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. ubuntu下使用opencv问题以及解决方案

    CMakeFiles/hw5_1_node.dir/computeORB.o: In function `cv::String::~String()':/usr/local/include/openc ...

  2. svg 图片

    https://studio.qcloud.coding.net/rs2/d67e3c26b502365f8ab7c05d71c70471.svg 腾讯编辑器loading页面的svg

  3. linux下lampp的启动和停止脚本

    今天试着写了lampp的启动停止脚本,和上一篇的tomcat的启动停止有一点小区别,就是lampp启动之后有很多的进程号,如果按照tomcat的停止脚本写就会出错,下面做细细的介绍 1.lampp的停 ...

  4. Windows与Linux的命令行命令对比

    Windows与Linux的命令行命令对比 * Windows不区分大小写,Linux区分大小写的. sn DOS Command UNIX Equivalent Effect 影响 1 ASSIGN ...

  5. AOP统一处理Web请求日志

    <!--aop--> <dependency> <groupId>org.springframework.boot</groupId> <arti ...

  6. 简单kmp算法(poj3461)

    题目简述: 给你两个字符串p和s,求出p在s中出现的次数. 思路简述: 在介绍看BF算法时,终于了解到了大名鼎鼎的KMP算法,结果属于KMP从入门到放弃系列,后来看了几位大神的博客,似乎有点懂了.此题 ...

  7. Excel 导入 Mysql

    1.将Excel xls文件 另存为 csv 文件: 2.用记事本打开csv文件,然后另存为编码为utf-8的txt文件: 3.将txt文件后缀更改为csv 4.最后,用phpmyadmin或其他数据 ...

  8. Day 20 常用模块(三)

    一.加密模块 1.加密方式: 1.有解密的加密方式 2.无解密的加密方式,碰撞检查 1.不同数据加密后的结果一定不一致 2.相同数据的加密结果一定是一致 2.hashlib模块 1.基本使用 ciph ...

  9. security cookie 机制(2)--- 初始化___security_cookie

    在 cookie 检查中,必定先要取出初始的 cookie 值: 0011392E A1 14 70 11 00       mov         eax,dword ptr [___securit ...

  10. C语言堆栈入门——堆和栈的区别(转)

    一.预备知识—程序的内存分配    一个由C/C++编译的程序占用的内存分为以下几个部分    1.栈区(stack)—   由编译器自动分配释放   ,存放函数的参数值,局部变量的值等.其    操 ...