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. 微信公众号本地断点调试(frp反向代理或Remote Debugger)

    问题描述: 需要开发微信授权和订阅推送,但是感觉调试不方便,就试着几种方式.因为是用的C#开发,Visual Studio工具自带配套的远程工具 (Remote Debugger).但是感觉不稳定,容 ...

  2. import、export使用介绍

    import.export使用介绍 ES6提供的import.export方法, 使组件化开发模式迈向新高度.本文来介绍import.export的语法及使用方法. 根据 export 的导出方式,可 ...

  3. FineReport连接多维数据库示例及操作

    1. 描述 FineReport连接多维数据库,首先要通过数据连接将多维数据库与FineReport连接起来,然后在数据连接的基础上新建多维数据库XMLA数据集,用于模板设计. 2.XMLA数据连接 ...

  4. ActiveReports 报表控件V12新特性 -- 文本框和标签控件的浓缩

    ActiveReports是一款专注于 .NET 平台的报表控件,全面满足 HTML5 / WinForms / ASP.NET / ASP.NET MVC / WPF 等平台下报表设计和开发工作需求 ...

  5. 移动设备 小米2S不显示CD驱动器(H),便携设备,MTP,驱动USB Driver,MI2感叹号的解决方法

    小米2S不显示CD驱动器(H),便携设备,MTP,驱动USB Driver,MI2感叹号的解决方法 by:授客 QQ:1033553122 用户环境 操作系统:Win7 手机设备:小米2S   问题描 ...

  6. 单表(SSM、SpringBoot、SpringCloud、Freemaker、BootStrap等)

    山门也有门门道道, 开发.测试.安卓...... 小子被纳入MIS小山峰,虽不及BOP势力庞大,高手如云, 仅寥寥七人, 却也于入小山峰之事乐趣至极. 前几日峰主布下一道新手任务, 制作一张单表并运行 ...

  7. [JAVA] 重写以及@Override标签

    以前JAVA看的少,最近做项目,对@Override的调用顺序有点疑惑,故查了一些资料.既然查资料了,那就把能看到的知识点整理一下,以供日后学习. 原文地址请保留http://www.cnblogs. ...

  8. GDI+编程(画笔/画刷/路径/区域)

    构造Graphics对象 Graphics类是GDI+程序设计的核心,Graphics类能够完成大部分的绘图,文本输出,几何图形的填充及坐标系统的转换等各种操作.在功能上,它与GDI的设备环境(DC) ...

  9. 在 Windows 上创建虚拟机规模集和部署高度可用的应用

    利用虚拟机规模集,可以部署和管理一组相同的.自动缩放的虚拟机. 可以手动缩放规模集中的 VM 数,也可以定义规则,以便根据资源使用情况(如 CPU 使用率.内存需求或网络流量)进行自动缩放. 在本教程 ...

  10. 如何在EF Core 使用存储过程

    使用EF Core框架能快速的帮助我们进行常规的数据处理和项目开发,但是ORM虽然好用,但是在许多复杂逻辑的数据处理时,我个人还是偏向用SQL和存储过程的方式去处理,但是研究了一下目前最新版本的EF ...