当前位置: 首页 > news >正文

简单 php结合WebUploader实现文件上传功能

WebUploader 资源下载
http://fex.baidu.com/webuploader/download.html

WebUploader 使用方法
http://fex.baidu.com/webuploader/getting-started.html

php 上传代码

<?php
header('Content-type:text/html;charset=utf-8');if($_FILES['file']['error'] == 0){  // 判断上传是否正确$fileName = $_FILES['file']['name'];  // 获取文件名称$fileSize = $_FILES['file']['size'];  // 获取文件大小$tmp_name = $_FILES["file"]["tmp_name"]; // 获取上传文件默认临时地址$fileTypeInfo = ['doc','jpg','png','docx','xls','xlsx','log'];  // 定义允许上传文件类型【很多种只列举3种】$fileType = substr(strrchr($fileName,'.'),1); // 提取文件后缀名if(!in_array($fileType,$fileTypeInfo)){  // 判断该文件是否为允许上传的类型echo '上传失败,文件格式不正确';die();}if($fileSize /1024 > 10240){  // 规定文件上传大小【文件为Byte/1024 转为 kb】echo '上传失败,文件太大请上传小于1024Kb';die();}date_default_timezone_set('PRC'); // 定义时间戳if(!file_exists('D:/PHPsoftware/wamp64/www/stt/')){  // 判断是否存在存放上传文件的目录mkdir('D:/PHPsoftware/wamp64/www/stt/');  // 建立新的目录}else{$newFileName = $fileName;  // 命名新的文件名称if(move_uploaded_file($tmp_name,'D:/PHPsoftware/wamp64/www/stt/'.$newFileName)){  // 移动文件到指定目录echo ("‘../../PHPsoftware/wamp64/www/stt/cs’   上传成功");}}}else{echo "上传失败".$_FILES['file']['error'];  // 显示错误信息}?>

html 页面代码

jquery下载地址(注意:使用webuploader 插件必须得jquery-1.11.1版本及以上才可以
http://code.jquery.com/jquery-1.11.1.min.js


<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title><!--引入CSS--><link rel="stylesheet" type="text/css" href="./assets/js/webuploader.css"><!--引入JS--><script src="./assets/js/jquery-1.11.1.min.js"></script><script src="./assets/js/webuploader.js"></script><script type="text/javascript">$(function() {//开始上传按钮var $btn = $('#ctlBtn');//文件信息显示区域var $list = $('#thelist');//当前状态var state = 'pending';//初始化Web Uploadervar uploader = WebUploader.create({// swf文件路径swf: './assets/js/Uploader.swf',// 文件接收服务端。server: 'upload.php',// 选择文件的按钮。可选。// 内部根据当前运行是创建,可能是input元素,也可能是flash.pick: '#picker',//设置文佳上传的类型格式accept: {  //不建议使用,使用时选择文件div失效title: 'file',extensions: 'xls,xlsx,word,doc,ppt,docx,rtf,ppt,txt,pptx,pdf',mimeTypes: '.xls,.xlsx,.word,.doc,.ppt,.docx,.rtf,.ppt,.txt,.pptx,.pdf'}});// 当有文件被添加进队列的时候(选择文件后调用)uploader.on( 'fileQueued', function( file ) {$list.append( '<div id="' + file.id + '" class="item">' +'<h4 class="info">' + file.name + '</h4>' +'<p class="state">等待上传...</p>' +'</div>' );});// 文件上传过程中创建进度条实时显示。uploader.on( 'uploadProgress', function( file, percentage ) {var $li = $( '#'+file.id );$li.find('p.state').text('上传中(' + parseInt(percentage * 100) + '%)');});// 文件上传成功后会调用uploader.on( 'uploadSuccess', function( file ) {$( '#'+file.id ).find('p.state').text('已上传');savefilemanager("/vod/uploadfilemanager/"+file.name,file.name);});// 文件上传失败后会调用uploader.on( 'uploadError', function( file ) {$( '#'+file.id ).find('p.state').text('上传出错');});// 文件上传完毕后会调用(不管成功还是失败)uploader.on( 'uploadComplete', function( file ) {$( '#'+file.id ).find('.progress').fadeOut();});// all事件(所有的事件触发都会响应到)uploader.on( 'all', function( type ) {if ( type === 'startUpload' ) {state = 'uploading';} else if ( type === 'stopUpload' ) {state = 'paused';} else if ( type === 'uploadFinished' ) {state = 'done';}if ( state === 'uploading' ) {$btn.text('暂停上传');} else {$btn.text('开始上传');}});// 开始上传按钮点击事件响应$btn.on( 'click', function() {if ( state === 'uploading' ) {uploader.stop();} else {uploader.upload();}});});
</script>
<style>#picker {display: inline-block;}#ctlBtn {position: relative;display: inline-block;cursor: pointer;background: #EFEFEF;padding: 10px 15px;color: #2E2E2E;text-align: center;border-radius: 3px;overflow: hidden;}#ctlBtn:hover {background: #DDDDDD;}<style>.webuploader-container {position: relative;}.webuploader-element-invisible {position: absolute !important;clip: rect(1px 1px 1px 1px); /* IE6, IE7 */clip: rect(1px,1px,1px,1px);}.webuploader-pick {position: relative;display: inline-block;cursor: pointer;background: #00b7ee;padding: 10px 15px;color: #fff;text-align: center;border-radius: 3px;overflow: hidden;}.webuploader-pick-hover {background: #00a2d4;}.webuploader-pick-disable {opacity: 0.6;pointer-events:none;}#picker {display: inline-block;}#ctlBtn {position: relative;display: inline-block;cursor: pointer;background: #EFEFEF;padding: 10px 15px;color: #2E2E2E;text-align: center;border-radius: 3px;overflow: hidden;}#ctlBtn:hover {background: #DDDDDD;}#picker {display: inline-block;}#ctlBtn {position: relative;display: inline-block;cursor: pointer;background: #EFEFEF;padding: 10px 15px;color: #2E2E2E;text-align: center;border-radius: 3px;overflow: hidden;}#ctlBtn:hover {background: #DDDDDD;}</style></head><body><div id="uploader" class="wu-example"><div class="btns"><div id="picker">选择文件</div><div id="ctlBtn" class="webuploader-upload">开始上传</div></div><!--用来存放文件信息--><div id="thelist" class="uploader-list"></div></div></body>
</html>

相关文章:

简单 php结合WebUploader实现文件上传功能

WebUploader 资源下载 http://fex.baidu.com/webuploader/download.html WebUploader 使用方法 http://fex.baidu.com/webuploader/getting-started.html php 上传代码 <?php header(Content-type:text/html;charsetutf-8);if($_FILES[file][error] 0){ // 判断上传是…...

Pandas数据分析一览-短期内快速学会数据分析指南(文末送书)

前言 三年耕耘大厂数据分析师&#xff0c;有些工具是必须要掌握的&#xff0c;尤其是Python中的数据分析三剑客&#xff1a;Pandas&#xff0c;Numpy和Matplotlib。就以个人经验而已&#xff0c;Pandas是必须要掌握的&#xff0c;它提供了易于使用的数据结构和数据操作工具&am…...

应用程序分类与相关基本概念介绍

0、引言 在从事软件开发的过程中&#xff0c;由于笔者并不是计算机专业的同学&#xff0c;所以时常会对一些概念感到困惑。比如&#xff1a; 前些年很火的前端和后端是什么意思&#xff1f;什么是 GUI&#xff1f;什么是 CLI&#xff1f;计算机的应用程序分为哪些种类&#x…...

springcloude gateway的意义

应用场景 1、南北向流量 需要流量网关和微服务网关配合使用&#xff0c;将内部的微服务能力&#xff0c;以统一的 HTTP 接入点对外提供服务。 流量网管主要是接入流量进行负载均衡&#xff0c;上游的微服务网关地址和数量变化不大&#xff0c;对服务发现要求不高。 微服务网…...

重新定义每天进步一点点

日拱一卒&#xff0c;每天进步一点点~ 这个主题之前写过一次&#xff0c;今天看了《全情投入》又有了新的感触&#xff0c;于是将其记录下来。 关于目标的设定问题 目标不是改变自己的日常行动&#xff0c;而是改变进行活动时的思维&#xff01; 有些事情&#xff0c;坚持下…...

代码随想录算法训练营第51天 | ● 309.最佳买卖股票时机含冷冻期 ● 714.买卖股票的最佳时机含手续费

文章目录 前言一、309.最佳买卖股票时机含冷冻期二、714.买卖股票的最佳时机含手续费总结 前言 买卖股票 完结&#xff1b; 一、309.最佳买卖股票时机含冷冻期 确定dp数组以及下标的含义 dp[i][j]&#xff0c;第i天状态为j&#xff0c;所剩的最多现金为dp[i][j]。 其实本题很多…...

李佳琦掉粉,国货品牌却从“商战大剧”走向“情景喜剧”

李佳琦直播间带货怼网友&#xff0c;“哪里贵了&#xff0c;国货很难的”“这么多年工资没涨&#xff0c;有没有认真工作&#xff1f;”本人事后垂泪道歉仍掉粉百万&#xff0c;但是闻风而来的国货品牌却迎来了一场流量盛宴。 从蜂花蹲点“捡”粉丝&#xff0c;上架三款79元洗…...

linux 下 C++ 与三菱PLC 通过MC Qna3E 二进制 协议进行交互

西门子plc 有snap7库 进行交互&#xff0c;并且支持c 而且跨平台。但是三菱系列PLC并没有现成的开源项目&#xff0c;没办法只能自己拼接&#xff0c;我这里实现了MC 协议 Qna3E 帧&#xff0c;并使用二进制进行交互。 #pragma once#include <stdio.h> #include <std…...

Spring基础(2w字---学习总结版)

目录 一、Spirng概括 1、什么是Spring 2、什么是容器 3、什么是IoC 4、模拟实现IoC 4.1、传统的对象创建开发 5、理解IoC容器 6、DI概括 二、创建Spring项目 1、创建spring项目 2、Bean对象 2.1、创建Bean对象 2.2、存储Bean对象&#xff08;将Bean对象注册到容器…...

07 目标检测-YOLO的基本原理详解

一、YOLO的背景及分类模型 1、YOLO的背景 上图中是手机中的一个app&#xff0c;在任何场景下(工业场景&#xff0c;生活场景等等)都可以试试这个app和这个算法&#xff0c;这个app中间还有一个button&#xff0c;来调节app使用的模型的大小&#xff0c;更大的模型实时性差但精…...

每日一题 78子集(模板)

题目 78 给你一个整数数组 nums &#xff0c;数组中的元素 互不相同 。返回该数组所有可能的子集&#xff08;幂集&#xff09;。 解集 不能 包含重复的子集。你可以按 任意顺序 返回解集。 示例 1&#xff1a; 输入&#xff1a;nums [1,2,3] 输出&#xff1a;[[],[1],[2]…...

OpenCV之形态学操作

形态学操作包含以下操作&#xff1a; 腐蚀 (Erosion)膨胀 (Dilation)开运算 (Opening)闭运算 (Closing)形态梯度 (Morphological Gradient)顶帽 (Top Hat)黑帽(Black Hat) 其中腐蚀和膨胀操作是最基本的操作&#xff0c;其他操作由这两个操作变换而来。 腐蚀 用一个结构元素…...

设计模式:享元模式

设计模式&#xff1a;享元模式 什么是享元模式 首先我们需要简单了解一下什么是享元模式。享元模式(Flyweight Pattern):主要用于减少创建对象的数量&#xff0c;以减少内存占用和提高性能。享元模式的重点就在这个享字&#xff0c;通过一些共享技术来减少对象的创建&#xff…...

汉诺塔问题(包含了三台柱和四台柱)——C语言版本

目录 1. 什么是汉诺塔 2. 三座台柱的汉诺塔 2.1 思路 2.2 三座台柱的汉诺塔代码 3. 四座台柱的汉诺塔 3.1 思路 3.2 四座台柱的汉诺塔代码 1. 什么是汉诺塔 汉诺塔代码的功能&#xff1a;计算盘子的移动次数&#xff0c;由数学公式知&#xff0c;汉诺塔的盘子移动次数与…...

【实训项目】滴滴电竞APP

1.设计摘要 2013年国家体育总局决定成立一支由17人组成的电子竞技国家队&#xff0c;第四届亚室会中国电竞代表队 出战第四届亚洲室内和武道运动会。 2014年1月13日CCTV5《体育人间》播放英雄联盟皇族战队的纪录片。 在2015到2019年间&#xff0c;我国电竞战队取得的无数值得…...

C++核心编程--类篇

C核心编程 1.内存分区模型 C程序在执行时&#xff0c;将内存大方向分为4个区域 意义&#xff1a;不同区域存放数据&#xff0c;赋予不同的生命周期&#xff0c;更能灵活编程 代码区&#xff1a;存放函数体的二进制代码&#xff0c;由操作系统进行管理的全局区&#xff1a;存放…...

java中用feign远程调用注解FeignClient的时候不重写Encoder和Decoder怎么格式不对呢?

如果在使用 Feign 进行远程调用时&#xff0c;没有重写 Encoder 和 Decoder&#xff0c;但仍然遇到格式不对的问题&#xff0c;可能是由于以下原因之一&#xff1a; 服务端返回的数据格式与客户端期望的格式不匹配&#xff1a;Feign 默认使用基于 Jackson 的 Encoder 和 Decode…...

记录使用Docker Compose 部署《XAPI项目》遇道的问题及解决方案

《XAPI项目》&#xff1a;GitHub仓库&#xff08;勿打&#x1f6ab;小破站一个&#xff09; 这篇文档&#xff0c;主要内容是记录使用Docker Compose 部署《XAPI项目》遇道的问题及解决方案 目录 &#x1f4da; 本地MySQL数据如何导入到容器内的MySQL中❎ 解决报错&#xff1a;…...

腾讯云OCR实践 - 降低客服财务运营成本

一、 前言&#xff1a; 随着图片时代的飞速发展&#xff0c;大量的文字内容为了优化排版和表现效果&#xff0c;都采用了图片的形式发布和存储&#xff0c;这为内容的传播和安全性带来了很大的便利&#xff0c;需要做重复性劳动。 OCR文字扫描工具也逐渐的应运而生&#xff0c;…...

springboot+vue上传图片

这里是一个简单的示例&#xff0c;演示了如何在Spring Boot中从Vue.js上传图像&#xff1a; 1.前端Vue.js代码&#xff1a; <template><div><input type"file" change"handleFileUpload"><button click"uploadImage">…...

高压电缆护层接地环流及温度在线监测系统

高压电缆的金属护层是电缆的重要组成部分&#xff0c;当缆芯通过电流时&#xff0c;会在金属护层上产生环流&#xff0c;外护套的绝缘状态差、接地不良、金属护层接地方式不正确等等都会引起护套环流异常现象&#xff0c;严重威胁电缆运行安全。 当电缆金属护层环流出现异常时…...

无涯教程-JavaScript - IPMT函数

描述 IPMT函数根据定期,固定的还款额和固定的利率返回给定投资期限内的利息支付。 语法 IPMT (rate, per, nper, pv, [fv], [type])争论 Argument描述Required/OptionalRateThe interest rate per period.RequiredPerThe period for which you want to find the interest a…...

【EI会议征稿】第三届机械自动化与电子信息工程国际学术会议(MAEIE 2023)

第三届机械自动化与电子信息工程国际学术会议&#xff08;MAEIE 2023&#xff09; 第三届机械自动化与电子信息工程国际学术会议&#xff08;MAEIE 2023&#xff09;将于2023年12月15-17日在江苏南京举行。本会议通过与业内众多平台、社会各团体协力&#xff0c;聚集机械自动…...

手写实现LRN局部响应归一化算子

1、重写算子的需求 芯片推理过程中遇到很多算子计算结果不对的情况&#xff0c;原因是封装的算子会在某些特殊情况下计算超限&#xff0c;比如输入shape特别大或者数值特别大时&#xff0c;LRN算子计算会出现NAN值&#xff0c;所以需要重写算子。先对输入数据做一个预处理&…...

朗思科技数字员工通过统信桌面操作系统兼容性互认认证

近日&#xff0c;朗思科技数字员工与统信桌面操作系统V20进行了兼容互认&#xff0c;针对上述产品的功能、兼容性方面&#xff0c;通过共同严格测试表明——朗思科技数字员工在统信桌面操作系统 V20上整体运行稳定&#xff0c;满足功能及兼容性测试要求。 北京朗思智能科技有限…...

十六、Webpack常见的插件和模式

一、认识插件Plugin Webpack的另一个核心是Plugin&#xff0c;官方有这样一段对Plugin的描述&#xff1a; While loaders are used to transform certain types of modules, plugins can be leveraged to perform a wider range of tasks like bundle optimization, asset m…...

ChatGPT新增超强插件:文本直接生成视频、海报,支持自定义修改!

全球著名在线设计平台Canva&#xff0c;在ChatGPT Plus&#xff08;GPT-4&#xff09;上推出了插件功能&#xff0c;用户通过文本提示&#xff0c;几秒钟就能生成演示文稿、PPT插图、电子书封面、宴会邀请函等各种精美设计海报&#xff0c;同时支持生成视频。 该插件最强大的功…...

亚像素边缘提取的例子

求帮忙下载&#xff1a; 1.http://download.csdn.net/detail/pkma75/925394 pkma75 资源积分&#xff1a;1分 备注&#xff1a;pdf格式&#xff0c;用曲线拟合的方法计算亚像素&#xff0c;编程易实现&#xff0c;具有较强的实用价值 2.http://download.csdn.net/detail/kua…...

Wayland:推动Linux桌面进入下一代图形显示时代

文章首发地址 Wayland是Linux系统下的一种图形显示协议&#xff0c;旨在替代X Window System&#xff08;X11&#xff09;作为Linux桌面环境的图形显示服务。下面是对Wayland的详细解释&#xff1a; 背景&#xff1a; 传统的Linux桌面环境使用X Window System&#xff08;X11&…...

mysql外键(foreign key)

简介 MySQL的外键约束用来在两个表数据之间建立链接&#xff0c;其中一张表的一个字段被另一张表中对应的字段约束。也就是说&#xff0c;设置外键约束至少要有两种表&#xff0c;被约束的表叫做从表&#xff08;子表&#xff09;&#xff0c;另一张叫做主表&#xff08;父表&…...

临沂住房和城乡建设厅网站/直通车关键词优化口诀

前几天撸项目代码时, 由一个技术点间接牵扯出了这东西. 所以就来总结一下. 深拷贝   拷贝对象每个层级的属性.   作用的对象是 js中引用类型的对象,基本类型没有涉及.   本质上将引用类型的对象在堆上重新开辟一块新的空间进行存放. 1 var p_1 {name: 病猫, age: 22}; 2…...

如何做网站首页/没被屏蔽的国外新闻网站

2019独角兽企业重金招聘Python工程师标准>>> onLoad: function () {var that this// 获取接口城市数据wx.request({url: userCarUtil.host userCarUtil.getCity,success: function (res) {//console.log(res.data)that.setData({citysMap: res.data})}})}转载于:h…...

手机网站有什么好处/友妙招链接怎么弄

今天碰到了一个超级恶心的问题&#xff0c;BitmapFactory.decodeStream(bis,null,options)一直是返回NULL 问题是这样子的&#xff1a; 1 InputStream is response.body().byteStream();2 Bitmap bm;3 BitmapFactory.Options optionsnew Bit…...

美容医疗 网站建设/有链接的网站

所谓常量即只能读取不能编辑&#xff08;删除&#xff0c;修改&#xff09;的变量。 js并没有原始的常量说法&#xff08;即自定义的&#xff0c;原生态的&#xff09;&#xff0c;但是可以用一些偏僻的路子去创建。 1&#xff1a;const es6中的声明关键词。 上面声明了两个变量…...

仙居谁认识做网站的/重庆网站建设与制作

mysql 误删&#xff0c;误更新数据恢复 脚本&#xff0c;基于row格式binlog恢复时需要指定-s columnsize(字段行数) -t update/delete(恢复类型)update语句需要手动更新colunmlist的值(字段列表)python脚本如下&#xff1a;#!/usr/bin/python#codingutf-8#Author&#xff1a;ea…...

大数据平台网站建设/软件注册推广平台

1.实现目标&#xff1a; 选择用户角色&#xff0c;自动勾选权限。 2. (1)MySQL数据库的建立 (2)ng-repeat指令显示用户权限 (3)ng-checked指令控制用户权限 3.实例 (1)MySQL数据库的建立 t_role表 id rolename 1 系统管理员 2 总经理 r_right表 id …...