ssi-uploader上传图片插件,点击选择文件按钮自动提交表单解决办法
先介绍一下这款插件,然后再谈使用中可能遇到的问题
ssi-uploader是一个JQuery的图片上传插件,界面比较美观
github地址:https://github.com/ssbeefeater/ssi-uploader
演示地址:http://ssbeefeater.github.io/#ssi-uploader/examples
使用文档:http://ssbeefeater.github.io/#ssi-uploader/documentation
这里就不说明怎么使用了,github上面提供有,官网文档上面也有
本博文主要说两个问题,也是我使用时碰到的,后续碰到问题在来补充
1、中文显示问题(虽然官方说支持中文,但在js文件源码中并没有写这块儿的代码)
2、当点击选择文件时,自动提交表单<form>的action地址
问题1解决办法:
使用文本编辑器(或任何一款代码编辑器)打开ssi-uploader.js文件,滑动至文档几行最后,会看到只有en英文,和希腊文,
在locale添加如下代码,注意添加逗号。
,
zh_CN: {
success: '成功',
sucUpload: '上传成功',
chooseFiles: '选择文件',
uploadFailed: '上传失败',
serverError: '服务器内部错误',
error: '错误',
abort: '终止',
aborted: '已经终止',
files: '文件',
upload: '上传',
clear: '清空',
drag: '将文件拖放到这里',
sizeError: '文件$1,超过限制大小$2',// $1=file name ,$2=max ie( example.jpg has has exceed the size limit of 2mb)
extError: '不支持$1类型的文件',//$1=file extension ie(exe files are not supported)
someErrorsOccurred: '发生了一些错误'
}
然后在使用时这样即可,注意第五行
$('#ssi-upload').ssi_uploader({
url: '#',
preview: false,
maxNumberOfFiles: 1,
locale: "zh_CN",
allowed: ['jpg', 'gif', 'txt', 'png', 'pdf']
});
问题2解决办法:
根本原因我没有找到,不过我找到一种方法可以解决
首先在html文档中,给input添加属性data-validate="required:" ,即不可无值
<input data-validate="required:" type="file" multiple id="ssi-upload" />
然后修改ssi-uploader.js文件的67行,将
$input.on('change', function () { //choose files
thisS.toUploadFiles(this.files);
$input.val('');
});
改为
$input.on('change', function () { //choose files
thisS.toUploadFiles(this.files);
$input.val('a');
});
网上这个问题信息比较少,所以希望对大家有帮助,后续遇到问题还会补充
转载请注明地址谢谢:http://www.cnblogs.com/wu-yun-jiang/p/6289206.html
ssi-uploader上传图片插件,点击选择文件按钮自动提交表单解决办法的更多相关文章
- Django---静态文件配置,post提交表单的csrf问题(日后细说),创建app子项目和分析其目录,ORM对象关系映射简介,Django操作orm(重点)
Django---静态文件配置,post提交表单的csrf问题(日后细说),创建app子项目和分析其目录,ORM对象关系映射简介,Django操作orm(重点) 一丶Django的静态文件配置 #we ...
- sublime text2 打开包含中文的文件会自动追加.dump后缀解决办法
用sublime text2 打开.c, .h,.txt等文件会自动追加一个.dump后缀,這样在打开.c,.h等文件时无法正常识别,从而无法正常进行语法着色,网上说是因为安装了GBK Encodin ...
- 异步提交表单插件jquery.form.min.js的使用实例
因为项目中需要达到效果:前台点击按钮弹出文件选择框,选择文件确定之后,上传到后台对文件进行处理并给出响应信息. 尝试过使用$.post,$.ajsx,将表单序列化之后传到后台,但是后台并不能收到文件, ...
- form表单action提交表单,页面不跳转且表单数据含文件的处理方法
在最近的项目中需要将含 input[type='file']的表单提交给后台 ,并且后台需要将文件存储在数据库中.之前所用的方法都是先将文件上传到七牛服务器上,然后七牛会返回文件的下载地址,在提交表单 ...
- 基于ASP.Net +easyUI框架上传图片,实现图片上传,提交表单
<body> <link href="../../Easyui/themes/easyui.css" rel="stylesheet" typ ...
- ajax提交表单、ajax实现文件上传
ajax提交表单.ajax实现文件上传,有需要的朋友可以参考下. 方式一:利用from表单的targer属性 + 隐藏的iframe 达到类似效果, 支持提交含有文件和普通数据的复杂表单 方式二:使用 ...
- java模拟表单上传文件,java通过模拟post方式提交表单实现图片上传功能实例
java模拟表单上传文件,java通过模拟post方式提交表单实现图片上传功能实例HttpClient 测试类,提供get post方法实例 package com.zdz.httpclient; i ...
- 第一百八十六节,jQuery,验证表单插件,Ajax 表单插件,验证和提交表单
jQuery,验证表单插件,Ajax 表单插件,验证和提交表单 HTML <form id="reg" method="post" action=&quo ...
- Django框架之第二篇--app注册、静态文件配置、form表单提交、pycharm连接数据库、django使用mysql数据库、表字段的增删改查、表数据的增删改查
本节知识点大致为:静态文件配置.form表单提交数据后端如何获取.request方法.pycharm连接数据库,django使用mysql数据库.表字段的增删改查.表数据的增删改查 一.创建app,创 ...
随机推荐
- gtest框架
解析gtest框架运行机制 1.前言 Google test是一款开源的白盒单元测试框架,据说目前在Google内部已在几千个项目中应用了基于该框架的白盒测试. 最近的工作是在搞一个基于gtest ...
- 快速构建Windows 8风格应用24-App Bar构建
原文:快速构建Windows 8风格应用24-App Bar构建 本篇博文主要介绍构建AppBar基本步骤.如何构建AppBar.如何在AppBar中构建上下文命令.如何在AppBar中构建菜单.如何 ...
- JS获取字符串实际长度
JS中默认中文字符长度和其它字符长度计算方法是一样的,但某些情况下我们需要获取中文字符串的实际长度,代码如下: function strLength(str) { var realLength = 0 ...
- rpt水晶报表制作过程
原文:rpt水晶报表制作过程 最近公司安排一个以前的项目,里面需要用到水晶报表,由于原来做这个项目的同事离职,所在公司的同事报表做成了rdlc类型的,而这类报表在加载的时候很难动态的从数据库加载数据, ...
- Huffman 压缩和解压缩java实现
附上完整的代码 http://download.csdn.net/download/u010485034/7847447 Huffman编码原理这里就不说了,是.这里来讲讲利用Huffman编码来进行 ...
- C#边边角角(一)
前言 此篇为在学习C#基础时,熟悉C#的语法和高级特性的一些小的尝试和笔记,记录一下以供分享 集合初始化器 集合必须实现System.Collections.IEnumerable接口 集合必须包含A ...
- Repository 仓储,你的归宿究竟在哪?(上)
Repository 仓储,你的归宿究竟在哪?(上) 写在前面 写这篇博文的灵感来自<如何开始DDD(完)>,很感谢young.han兄这几天的坚持,陆陆续续写了几篇有关于领域驱动设计的博 ...
- ORACLE抽象数据类型
ORACLE抽象数据类型 *抽象数据类型*/1,抽象数据类型 概念包含一个或多个子类型的数据类型不局限于ORACLE的标准数据类型可以用于其他数据类型中 2,创建抽象数据类型 的语法(必须用NOT F ...
- MVC 插件式开发
MVC 插件式开发 在开发一个OA系统是,我们可能遇到 A模块. B模块 .C模块,这也模块组成一个完整的系统,买给客服.现在又有一个客服要我们做一个OA系统,唉我们发现,跟上一个OA系统差不多,但没 ...
- SpringMVC数据绑定
SpringMVC学习系列(5) 之 数据绑定-2 在系列(4)中我们介绍了如何用@RequestParam来绑定数据,下面我们来看一下其它几个数据绑定注解的使用方法. 1.@PathVariab ...