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. js-ES6学习笔记-修饰器

    1.修饰器对类的行为的改变,是代码编译时发生的,而不是在运行时.这意味着,修饰器能在编译阶段运行代码. 2. function testable(target) { target.isTestable ...

  2. CSS让DIV按照背景图片的比例缩放,并让背景图片填充整个元素(转)

    目的是:通过background的一系列属性,让DIV按照背景图片的比例缩放,并让背景图片填充整个DIV 首先我们需要让背景图片在指定的DIV中全部填充显示 之前看有用类似 background-at ...

  3. 防范跨站脚本攻击(XXS)的关键手段

    1:加强对提交信息和页面显示信息的过滤,让非法提交内容无处施展: 2:让存储在cookie中的sessionid 无法被js 读取到. 如今的xss 相比网上很多资料中,在技术上已经发生了很大变化.由 ...

  4. HTML中meta标签作用及属性总结

    在前端开发中编写html静态网页模板时,head标签内总是会带上许多meta标签,大多数时候并不十分了解这些标签的具体作用,只是别人写了我们也写上吧! 今天小编特意查询了一下关于网页中meta标签的作 ...

  5. 在PHP中避免一些代码中的坏味道

    做PHP开发已经有快一年的时间了,在这一年的时间中,学习了很多生产环境中的技巧,学习了很多东西,期间也阅读了一些优秀的源码和关于代码的书,对写代码这一块有了一定的思考,也看过很多别人写的好的代码和坏的 ...

  6. LeetCode题解之 Binary Tree Preorder Traversal

    1.题目描述 2.问题分析 利用递归. 3.代码 vector<int> preorderTraversal(TreeNode* root) { vector<int> v; ...

  7. SEO-搜索引擎优化

    一.定义 SEO(Search Engine Optimization):汉译为搜索引擎优化.是一种方式:利用搜索引擎的规则提高网站在有关搜索引擎内的自然排名.目的是:为网站提供生态式的自我营销解决方 ...

  8. AD账号解锁

    Get-ADUser -Filter * -Properties *  -SearchBase "dc=uxin,dc=youxinpai,dc=com"| ? {$_.locke ...

  9. Java中几种常用数据类型之间转换的方法

    Java中几种常用的数据类型之间转换方法: 1. short-->int 转换 exp: short shortvar=0; int intvar=0; shortvar= (short) in ...

  10. 阿里八八Alpha阶段Scrum(12/12)

    今日进度 俞鋆: 和前端对接,完成了注册接口的对接写了一部分数据同步接口. 李嘉群: 完成了注册界面与服务器的对接 黄梅玲: json数据解析并在listview中显示(还未完成) 王国超: 今天开始 ...