在web开发中，最纠结的一项就是文件上传，最近由于项目需要前后摸索了四天在这里分享给大家。如有不足，望指出！！

前台：jquery、easyui、html

后台：thinkphp

主要涉及语言：jquery，php

效果图如下：

及时上传主要思想：

在一个隐藏的div层中嵌入（iframe）上传页面，然后在单机照片框的时候，调用js文件中的函数，显示隐藏层（我这里用的是一个easyui的dialog控件），在嵌入的子页面的上传控件（file控件）上绑定一个change事件，并将自身作为参数传递过去（ <input id="file_upload" name="file_upload" type="file" multiple="true" onchange="parent.changeImg(this)"/>）在函数中验证其符不符合规则（类型，大小）；

提交后反馈文件的保持路径

具体js中的验证以及动态加载图片

这三个函数分别是验证，判断，和后台php回调，动态显示图片的功能，基本的思想就是这样，主要代码也再上面，相比较一些异步上传的插件，有点投机取巧的样子。但是我主要想说的是对自己要有信心，当我做这个功能的时候也感觉非常困惑，但是只要你能向到，一般就能做到，别人能实现的，咱们就可以实现。希望可以对大家有所帮助，同时有不足之处，或者好的办法也希望能与大家沟通整体效果如下：

jquery 判断当前上传文件大小限制上传格式 搭配thinkphp实现上传即预览（模拟异步上传）的更多相关文章

  1. jQuery + ashx 实现图片按比例预览、异步上传及显示

    目录(?)[-] 注ajax 方式异步读取数据库显示图片的方法同上传一致使用 ashx 返回base64字符串在客户端处理即可 记录一个让我纠结良久的问题 在Page_Load 函数中只有第一个用 S ...

  2. Android仿微信图片上传，可以选择多张图片，缩放预览，拍照上传等

    仿照微信,朋友圈分享图片功能 .可以进行图片的多张选择,拍照添加图片,以及进行图片的预览,预览时可以进行缩放,并且可以删除选中状态的图片 .很不错的源码,大家有需要可以下载看看 . 微信 微信 微信 ...

  3. 浅谈简单实现file控件的图片预览，裁剪和上传。

    1.图片预览之FileReader对象    FileReader 对象允许Web应用程序异步读取存储在用户计算机上的文件(或原始数据缓冲区)的内容,使用File或Blob对象指定要读取的文件或数据 ...

  4. jquery本地上传预览扩展(隐藏上传控件单击图片上传支持ie!!)

    我用到的原材料地址:http://www.cnblogs.com/leejersey/p/3660202.html 修改后: /// <reference path="../../Js ...

  5. springboot项目文件上传（绝对路径）并使用tomcat虚拟路径进行图片预览

    前言 项目中,需要上传文件,但是可能会比较多,所以不能放入项目目录中,需要指定目录并按顺序放置.并且:还需要这些数据可以预览(图片等). 那么问题就是:上传完成之后我存入服务器,并拿到绝对路径,存入数 ...

  6. 移动端 H5 拍照 从手机选择图片，移动端预览，图片压缩，图片预览，再上传服务器

    前言:最近公司的项目在做全网营销,要做非微信浏览器的wap 站 的改版,其中涉及到的一点技术就是采用H5 选择手机相册中的图片,或者拍照,再将获取的图片进行压缩之后上传. 这个功能模块主要有这5点比较 ...

  7. FileReader实现图片预览，并上传（js代码）

    var rFilter = /^(image\/bmp|image\/gif|image\/jpeg|image\/png|image\/tiff)$/i; //控制格式 var iMaxFilesi ...

  8. Android图片上传，可以选择多张图片，缩放预览，拍照上传等

    仿照微信,朋友圈分享图片功能 .可以进行图片的多张选择,拍照添加图片,以及进行图片的预览,预览时可以进行缩放,并且可以删除选中状态的图片 .很不错的源码,大家有需要可以下载看看 . 微信 微信 微信 ...

  9. h5可预览 图片ajax上传 ，后台有点弱不知道数据怎么取，但是可以肯定数据上传成功了

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

随机推荐

  1. hdu4185+poj3020（最大匹配+最小边覆盖）

    传送门:hdu4185 Oil Skimming 题意:n*n的方格里有字符*和#,只能在字符#上放1*2的板子且不能相交,求最多能放多少个. 分析:直接给#字符编号,然后相邻的可以匹配,建边后无向图 ...

  2. linux内核笔记-内核同步

    linux内核就相当于不断对请求进行响应的服务器,这些请求可能来自CPU,可能来自发出中断的外部设备.我们将内核看作两种请求的侍者. (1)老板提出请求,侍者如果空闲,为老板服务.(系统调用或异常) ...

  3. asp.net出现正在中止线程解决方案

    刚才又再次遇到了一个之前遇到的问题,在这里记录一下. 起因: 如果使用 Response.End.Response.Redirect 或 Server.Transfer 方法,将出现 ThreadAb ...

  4. hdu3415（单调队列）

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=3415 题意:一个长度为n包含正负整数的数环,即第1个的左边是第n个.从中选一个不超过k的序列,使得序列 ...

  5. hdu1042（大数模板）

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1042 在网上找了个大数模板方便以后用得到. #include<iostream> #inc ...

  6. 《Effective C++ 》学习笔记——条款02

    ****************************  一. Accustoming Yourself to C++ **************************** 条款02: Pref ...

  7. 十分钟搞懂什么是CGI（转）

    原文:CGI Made Really Easy,在翻译的过程中,我增加了一些我在学习过程中找到的更合适的资料,和自己的一些理解.不能算是严格的翻译文章,应该算是我的看这篇文章的过程的随笔吧. CGI真 ...

  8. sdut 6-2 多态性与虚函数

    6-2 多态性与虚函数 nid=24#time" title="C.C++.go.haskell.lua.pascal Time Limit1000ms Memory Limit ...

  9. 上市ASCII 表省内发现！

    表格来自,这里 扩展码表:

  10. Oracle改变字段类型

    由于需求变化.现在,我们要一个类型NUMBER(8,2)字段类型改变 char. 总体思路如以下:       将要更改类型的字段名改名以备份,然后加入一个与要更改类型的字段名同名的字段(原字段已经改 ...