在前台模拟ajax方法,写一个常用的模拟ajax上传文件的通用方法

假设现在有个按钮点击上传，那么直接在按钮上加上onclick事件写上对应的方法即可，比如这样

so easy，现在贴出来代码

var imgcontro = {

selectFile:function(imgname,action,params,callback){

var rand = parseInt(Math.random()*10000000000000),

paramArr = params != "" ? params.split(","):[];

$("form[id^='tmpForm_']").remove();

$("body").append(

'

'+

''+

''+

'

'

);

var from = $("#tmpForm_"+rand),file = from.find('input[type="file"]');

if(paramArr.length>0){

for(var i = 0;i

var thisKey = paramArr[i].split(":")[0].split("{")[1],

thisValue = paramArr[i].split(":")[1].split("}")[0];

from.append('');

}

}

file.click();

},

upload:function(obj,randcode,callBack){

var object = $(obj),form = object.parent(),

iframe = document.getElementById("tmpIframe_"+ randcode),

getResStr,w_timer,jsonData,filepath = object.val(),

extStart = filepath.lastIndexOf("."),

ext = filepath.substring(extStart,filepath.length).toUpperCase();

if(filepath == "" || filepath == null){

alert("请先选择一张图片");

return false;

}

if(ext!=".JPG"&&ext!=".JPEG"&&ext!=".GIF"&&ext!=".BMP"&&ext!=".PNG"){

alert("仅限于上传 jpeg，jpg，png，bmp，gif 格式的文件");

return false;

}

form.submit();

loading.s();

if (iframe.attachEvent) {

iframe.attachEvent("onload", function() {

getResStr = document.frames[iframe.id].document.body.innerHTML;

});

w_timer = setInterval(function(){

if(getResStr != ""){

clearInterval(w_timer);

loading.h();

callBack(getResStr);

}

},50);

} else {

iframe.onload = function() {

getResStr = iframe.contentDocument.body.innerHTML;

loading.h();

callBack(getResStr);

};

}

}

};

当然，为了体验更加友好，上传中的时候加个遮罩层和菊花，看起来不会以为是死机了，菊花代码在这，兼容手机端(jquery下，zepto暂时没解决兼容性问题)

var loading = {

s:function(){

$("#loading").show();

$("#loading").animate({opacity:1}, 300)

},

h:function(){

setTimeout(function(){

$("#loading").animate({opacity:0}, 500,'',function(){$("#loading").hide();})

},200);

}

}

好了，下班回家了，做个笔记

本文链接：https://www.92ez.com/?action=show&id=23376

!!! 转载请先联系non3gov@gmail.com授权并在显著位置注明作者和原文链接 !!! 小黑屋

提示：技术文章有一定的时效性，请先确认是否适用你当前的系统环境。