jquery ajaxfileuplod 上传文件 essyui laoding 效果【防止重复上传文件】


Posted in jQuery onMay 26, 2018
//放于上传前
function ajaxLoading(){  
  $("<div class=\"datagrid-mask\"></div>").css({display:"block",width:"100%",height:$(window).height()}).appendTo("body");  
  $("<div class=\"datagrid-mask-msg\"></div>").html("正在上传,请稍候。。。").appendTo("body").css({display:"block",left:($(document.body).outerWidth(true) - 190) / 2,top:($(window).height() - 45) / 2});  
 }  

//放于状态返回后
 function ajaxLoadEnd(){  
   $(".datagrid-mask").remove();  
   $(".datagrid-mask-msg").remove();        
}

function import(){
  ajaxLoading();
  $.ajaxFileUpload({
    url:'import.do',
    fileElementId:'importFile',
    type:'post',
    dataType : 'json',
    secureuri : false,
    success:function(data){
      ajaxLoadEnd();
      if(data&&data.code=="200"){
        $.messager.show({
          title:'提示',
          msg:'用户导入成功!',
          timeout:5000,
          showType:'slide'
        });
      }
      $('#table).datagrid('reload');
      return;
    },
    error: function(data, status, e) { //提交失败自动执行的处理函数。
      ajaxLoadEnd();
      if(data&&data.message){
        $.messager.alert("警告",data.message);
      }else{
        $.messager.alert("警告","导入失败,请联系相关人员");
      }
    }
  });
}

导入控件

<input type="file" id="importFile" name="importFile" />
    <a class="easyui-linkbutton" onclick="import()">批量导入用户</a>

效果就是  点击一次上传, 当上传操作结束后  才能操作界面

jquery ajaxfileuplod 上传文件 essyui laoding 效果【防止重复上传文件】

总结

以上所述是小编给大家介绍的jquery ajaxfileuplod 上传文件 essyui laoding 效果【防止重复上传文件】,希望对大家有所帮助如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

jQuery 相关文章推荐
jQuery插件FusionCharts实现的MSBar3D图效果示例【附demo源码】
Mar 23 jQuery
jQuery实现Select下拉列表进行状态选择功能
Mar 30 jQuery
jQuery插件FusionCharts绘制2D环饼图效果示例【附demo源码】
Apr 10 jQuery
浅谈struts1 &amp; jquery form 文件异步上传
May 25 jQuery
jQuery为某个div加入行样式
Jun 09 jQuery
jQuery Validate格式验证功能实例代码(包括重名验证)
Jul 18 jQuery
浅析vue-router jquery和params传参(接收参数)$router $route的区别
Aug 03 jQuery
jquery实现联想词搜索框和搜索结果分页的示例
Oct 10 jQuery
jQuery实现的模仿雨滴下落动画效果
Dec 11 jQuery
jQuery cookie的公共方法封装和使用示例
Jun 01 jQuery
jquery实现简单自动轮播图效果
Jul 29 jQuery
jQuery带控制按钮轮播图插件
Jul 31 jQuery
jquery.onoff实现简单的开关按钮功能(推荐)
May 24 #jQuery
jquery引入外部CDN 加载失败则引入本地jq库
May 23 #jQuery
jQuery实现form表单序列化转换为json对象功能示例
May 23 #jQuery
20个最常见的jQuery面试问题及答案
May 23 #jQuery
jQuery发请求传输中文参数乱码问题的解决方案
May 22 #jQuery
通过jquery toggleClass()属性制作文章段落更改背景颜色
May 21 #jQuery
jQuery获取随机颜色的实例代码
May 21 #jQuery
You might like
PR值查询 | PageRank 查询
2006/12/20 PHP
防止用户利用PHP代码DOS造成用光网络带宽
2011/03/01 PHP
php将session放入memcached的设置方法
2014/02/14 PHP
php上传图片并压缩的实现方法
2015/12/22 PHP
PHP使用glob方法遍历文件夹下所有文件的实例
2018/10/17 PHP
PHP获取对象属性的三种方法实例分析
2019/01/03 PHP
PHP如何使用cURL实现Get和Post请求
2020/07/11 PHP
JavaScript的document对象和window对象详解
2010/12/30 Javascript
js中的屏蔽的使用示例
2013/07/30 Javascript
js去除输入框中所有的空格和禁止输入空格的方法
2014/06/09 Javascript
SeaJS 与 RequireJS 的差异对比
2014/12/08 Javascript
js兼容火狐获取图片宽和高的方法
2015/05/21 Javascript
javascript创建函数的20种方式汇总
2015/06/23 Javascript
JavaScript中最常见的三个面试题解析
2017/03/04 Javascript
js利用for in循环获取 一个对象的所有属性以及值的实例
2017/03/30 Javascript
JavaScript限制在客户区可见范围的拖拽(解决scrollLeft和scrollTop的问题)(2)
2017/05/17 Javascript
vue.js 实现评价五角星组件的实例代码
2018/08/13 Javascript
微信小程序开发之左右分栏效果的实例代码
2019/05/20 Javascript
vue.js循环radio的实例
2019/11/07 Javascript
压缩Vue.js打包后的体积方法总结(Vue.js打包后体积过大问题)
2020/02/03 Javascript
[01:25:33]完美世界DOTA2联赛PWL S3 INK ICE vs Magma 第二场 12.20
2020/12/23 DOTA
Python linecache.getline()读取文件中特定一行的脚本
2008/09/06 Python
python2.7到3.x迁移指南
2018/02/01 Python
numpy实现合并多维矩阵、list的扩展方法
2018/05/08 Python
解决安装python库时windows error5 报错的问题
2018/10/21 Python
浅谈Python 列表字典赋值的陷阱
2019/01/20 Python
Python 读取用户指令和格式化打印实现解析
2019/09/02 Python
Win系统PyQt5安装和使用教程
2019/12/25 Python
预备党员思想汇报范文
2014/01/11 职场文书
企业给企业的表扬信
2014/01/13 职场文书
大学学习计划书范文
2014/05/02 职场文书
内科护士节演讲稿
2014/09/11 职场文书
优秀教育工作者事迹材料
2014/12/24 职场文书
开除通知书范本
2015/04/25 职场文书
2016年端午节红领巾广播稿
2015/12/18 职场文书
基于Redis延迟队列的实现代码
2021/05/13 Redis