jQuery多图上传图片上传精简版

所属分类:输入-上传

 69155  388  查看评论 (103)
分享到微信朋友圈
X
jQuery多图上传图片上传精简版 ie兼容10

使用方法

引入css

<link rel="stylesheet" href="css/upload.css">

创建容器

<script>
    //配置需要引入jq 1.7.2版本以上
    //服务器端成功返回 {state:1,path:文件保存路径}
    //服务器端失败返回 {state:0,errmsg:错误原因}
    //默认做了文件名不能含有中文,后端接收文件的变量名为file
    $("#zwb_upload").bindUpload({
        url:"/home/index/upload",//上传服务器地址
        callbackPath:"#callbackPath2",//绑定上传成功后 图片地址的保存容器的id或者class 必须为input或者textarea等可以使用$(..).val()设置之的表单元素
        // ps:值返回上传成功的 默认id为#callbackPath  保存容器为位置不限制,id需要加上#号,class需要加上.
        // 返回格式为:
        // 原来的文件名,服务端保存的路径|原来的文件名,服务端保存的路径|原来的文件名,服务端保存的路径|原来的文件名,服务端保存的路径....
        num:10,//上传数量的限制 默认为空 无限制
        type:"jpg|png|gif|svg",//上传文件类型 默认为空 无限制
        size:3,//上传文件大小的限制,默认为5单位默认为mb
    });
</script>
相关插件-上传

手机端实现多图片上传预览

HTML+CSS+原生JS实现手机端实现多图片上传,选中图片后,可以点击放大(有一定的注释,在PC,ipad,IOS和安卓上都测试过)
  上传
 33476  313

jQuery图片上传预览带压缩功能

基于jquery 的canvas压缩图片上传到服务器并在前端展示
  上传
 46059  325

基于amazeui头像上传

基于amazeui框架,设计的头像上传插件
  上传
 69321  486

js上传图片预览

js上传图片本地预览
  上传
 112435  536

讨论这个项目(103)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    zhudaqian 1
    2019/7/25 14:01:41

    不兼容还写兼容ie8

    回复
    226 0
    2019/6/19 16:38:44
    这个报错怎么处理一下,大哥
    Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
        灭霸媳妇0
        2019/7/25 14:30:35
        这个是提交时,通过ajax请求服务端url,本地预览时chrome会阻止ajax请求,所以提示这个,是正常的。
        这里只提供前端部分,后台根据自己所使用的语言去写哦。
    回复
    。。 0
    2019/3/28 17:10:12
    娇妹的大男孩儿 0
    2019/3/5 20:33:04
    大哥,这个是C#后台吗
    回复
    ☆ve期待ㄊ 0
    2018/12/21 15:51:22
    怎样修改插件,让他没有弹出框 回复
    陈独秀别秀了 0
    2018/9/18 16:21:25
    怎么没有删除那个按钮呢??
        Z0
        2018/11/8 15:32:11
        在图片上
    回复
    冰菱梦 0
    2018/8/29 9:46:03
    ie9、ie8、ie7都是 无法获取未定义或 null 引用的属性“length”,请问有谁解决了这个问题吗?jquery换的全是1.7.2 回复
    曾楚周 0
    2018/6/25 16:52:13
    请问各位大神,这个插件,后台怎么接收啊
        曾楚周0
        2018/6/25 16:53:45
        php 用 $_FILES 接不到
    回复
    CHRui 0
    2018/5/4 21:02:40
    不是说兼容IE8吗,我在IE8上选图片保错(无法获取未定义或 null 引用的属性"length")upload.min.js(1,398)
        冰菱梦0
        2018/8/29 9:34:54
        请问这个问题是否解决
    回复
    !!! 0
    2018/4/3 10:12:13
    大哥 能写下后台吗
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复