Maison  >  Article  >  interface Web  >  À propos de l'effet du téléchargement de fichiers jquery ajaxfileuplod essyui laoding

À propos de l'effet du téléchargement de fichiers jquery ajaxfileuplod essyui laoding

不言
不言original
2018-07-02 14:15:371816parcourir

Cet article présente principalement l'effet du téléchargement de fichiers essyui laoding par jquery ajaxfileuplod. Il a une certaine valeur de référence. Maintenant, je le partage avec tout le monde. Les amis dans le besoin peuvent s'y référer

//放于上传前
function ajaxLoading(){  
  $("<p class=\"datagrid-mask\"></p>").css({display:"block",width:"100%",height:$(window).height()}).appendTo("body");  
  $("<p class=\"datagrid-mask-msg\"></p>").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:&#39;import.do&#39;,
    fileElementId:&#39;importFile&#39;,
    type:&#39;post&#39;,
    dataType : &#39;json&#39;,
    secureuri : false,
    success:function(data){
      ajaxLoadEnd();
      if(data&&data.code=="200"){
        $.messager.show({
          title:&#39;提示&#39;,
          msg:&#39;用户导入成功!&#39;,
          timeout:5000,
          showType:&#39;slide&#39;
        });
      }
      $(&#39;#table).datagrid(&#39;reload&#39;);
      return;
    },
    error: function(data, status, e) { //提交失败自动执行的处理函数。
      ajaxLoadEnd();
      if(data&&data.message){
        $.messager.alert("警告",data.message);
      }else{
        $.messager.alert("警告","导入失败,请联系相关人员");
      }
    }
  });
}
<.>

Contrôle d'importation

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

L'effet est de cliquer une fois pour télécharger, et ce n'est qu'une fois l'opération de téléchargement terminée que vous pouvez faire fonctionner l'interface

Ce qui précède est l'intégralité du contenu de cet article. J'espère qu'il sera utile à l'étude de chacun. Pour plus de contenu connexe, veuillez faire attention au PHP chinois. site web!

Recommandations associées :

Mise en œuvre de la vérification globale sous bootstrapValidator basée sur jQuery

données de requête inter-domaines jsonp pour implémenter le mobile Méthode de requête de numéro de téléphone

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn