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

前端之家收集整理的这篇文章主要介绍了jquery ajaxfileuplod 上传文件 essyui laoding 效果【防止重复上传文件】前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

<div class="jb51code">
<pre class="brush:js;">
//放于上传
function ajaxLoading(){
$("<div class=\"datagrid-mask\">

").css({display:"block",width:"100%",height:$(window).height()}).appendTo("body");
$("<div class=\"datagrid-mask-msg\">
").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("警告","导入失败,请联系相关人员");
}
}
});
}

导入控件

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

总结

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

原文链接:https://www.f2er.com/jquery/32151.html

猜你在找的jQuery相关文章