1.引入资源


<script src="/yami/backend/backres/js/jquery.min.js"></script>
<script src="/yami/backend/backres/js/jquery.ui.widget.js"></script>
<script src="/yami/backend/backres/js/jquery.iframe-transport.js"></script>
<script src="/yami/backend/backres/js/jquery.fileupload.js"></script>

2.在form中加入
<input type="file" name="excel" id="fileupload" style="display:none" onclick="upload()" multiple/>
<a href='' onclick="document.getElementById('fileupload').click();return false;">
<div class="batch">批量导入用户手机号</div>
</a>

点击a标签触发<input>点击事件
 //选择文件后自己主动上传
function upload() {
$('#fileupload').fileupload({
url: "/yami/backend/coupon.getPhonesFromExcel.do",
dataType: 'json',
add: function (e, data) {
var goUpload = true;
var uploadFile = data.files[0];
if (!(/\.(xls||xlsx)$/i).test(uploadFile.name)) {
alert('请选择excel文件!');
goUpload = false;
}
if (uploadFile.size > 2000000) { // 2mb
alert('上传文件大小不得超过2M');
goUpload = false;
}
if (goUpload == true) {
data.submit();
}
},
done: function (e, data) {
document.getElementById("showPhones").innerHTML = "<p>成功上传" + data.result.length + "手机号!!!</p>";
document.getElementById("phoneList").setAttribute("value", data.result);
}
});
}

jQuery上传文件的更多相关文章

  1. JQuery 上传文件插件 Uploadify1

    基于jquery的文件上传控件,支持ajax无刷新上传,多个文件同时上传,上传进行进度显示,删除已上传文件. <link href="~/Content/themes/uploadif ...

  2. jquery上传文件控件Uploadify

    基于jquery的文件上传控件,支持ajax无刷新上传,多个文件同时上传,上传进行进度显示,删除已上传文件. 要求使用jquery1.4或以上版本,flash player 9.0.24以上. 有两个 ...

  3. JQuery上传文件插件Uploadify使用笔记

    新工作的第一份任务就是给实现 限制Uploadify 上传文件格式为图片 测试出来报错,选择了非图片文件,提示错误后,再选择其他文件,上传时还是包含了之前清空的非图片文件 最后实现效果的代码是 //上 ...

  4. MVC 使用jQuery上传文件

    在ASP.NET MVC Framework中,上传文件真是超级简单,看代码: View <formaction="<%=Url.Action("Process&quo ...

  5. jQuery上传文件控件Uploadify使用

    Uploadify是JQuery的一个上传插件,支持ajax无刷新上传,多个文件同时上传,上传进行进度显示,删除已上传文件等. 首先应下载jQuery和uploadify插件 jQuery下载地址:h ...

  6. jQuery上传文件显示进度条

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

  7. jQuery上传文件按钮美化

    效果图如下: 思路: 1:打开文件设置为透明,外面包一层标签,给标签设置颜色背景,给人点击浏览其实是点击打开文件的错觉.(给外标签相对定位,打开文件标签绝对定位). 2:点击浏览后,选择了文件,就把文 ...

  8. 关于使用客户端控件和jquery上传文件

    一.导入Jquery插件ajaxfileupload.js 下载地址:http://www.phpletter.com/Demo/AjaxFileUpload-Demo/ 使用方法: $.ajaxFi ...

  9. 使用Spring boot + jQuery上传文件(kotlin)

    文件上传也是常见的功能,趁着周末,用Spring boot来实现一遍. 前端部分 前端使用jQuery,这部分并不复杂,jQuery可以读取表单内的文件,这里可以通过formdata对象来组装键值对, ...

随机推荐

  1. 【CDQ分治】[HNOI2010]城市建设

    题目链接 线段树分治+LCT只有80 然后就有了CDQ分治的做法 把不可能在生成树里的扔到后面 把一定在生成树里的扔到并查集里存起来 分治到l=r,修改边权,跑个kruskal就行了 由于要支持撤销, ...

  2. ES6——TDZ(暂时性死区)

    暂时性的死区(Temporal Dead Zone),简写为 TDZ: 只要块级作用域里存在let命令,它所声明的变量就绑定这个区域,不在受外部的影响 let 和 const 声明的变量不会被提升到作 ...

  3. eclipse 中springboot2.0整合jsp 出现No Java compiler available for configuration options compilerClassName

    今天使用eclipse创建springboot整合jsp出现一个问题,在idea中并没有遇到这个问题.最后发现是需要在eclipse中添加一个eclipse依赖,依赖如下: <dependenc ...

  4. eclipse搭建hibernate环境

    一.打开eclipse,help=>Install New Software 输入:http://download.jboss.org/jbosstools/updates/stable/kep ...

  5. ActiveReports 报表应用教程 (14)---数据可视化

    葡萄城ActiveReports报表中提供了丰富的数据可视化解决方案,用户可以将数据以图像化的方式进行显示,让报表数据更加形象且便于理解.在葡萄城ActiveReports报表中提供了大多数常用的二维 ...

  6. TreeView失去焦点时亮显选中状态

    Windows Form下设置属性即可. TreeView.HideSelection = false

  7. CSS 小结笔记之变形、过渡与动画

    1.过渡 transition  过渡属性用法: transition :ransition-property  transition-duration  transition-timing-func ...

  8. 修改Sql Server 数据库文件默认存放目录

    -- 更改数据文件存放目录   EXEC xp_instance_regwrite     @rootkey='HKEY_LOCAL_MACHINE',     @key='Software\Micr ...

  9. python设计模式之门面模式

    一.结构型设计模式 门面模式与单例模式,工厂模式不同,它是一种结构型模式. 结构型模式描述如何将对象和类组合成更大的结构 结构型模式是一种能够简化设计工作的模式,它能找出更简单的方法来认识或表示实体之 ...

  10. windows服务器安装telnet的方法指引

    摘要: 1.telnet是一种网络排查的工具 2.当发现一台服务器异常的时候,通常有两个cmd命名做排查 3.ping 服务器ip,看网络是否联通 4.telnet 服务器ip 端口 看该服务器指定端 ...