$.ajax 默认不支持文件提交,
这里提供一个form target = iframe 的异步提交插件
如果需要提交文件form 需要设置属性 enctype="multipart/form-data",使用插件后会自动使用target = iframe提交form
实现异步提交,兼容性好,用法简单!
(function ($){
/**
* @name from的iframe提交 v0.1
* @desc 主要是考虑带file的from异步提交
* @param options
* success 成功调用函数 success(retex,toiframe);
* error 失败调用函数 error(toiframe);
* complete 完成调用函数 complete(toiframe,'success');
* isSubmit 是否自动提交,默认 false
* isOne 是否一次性, 默认 false
* @pending isAddDiscern 是否增加请求标识(默认iframe_async=1)如果是字符串添加此参数请求值为1
* @example $('form#file').form_iframe({success:function (retex){alert('提交成功,'+retex)}});
* @author hank
*/
$.fn.form_iframe = function (options){
var my = $(this);
var defaults = $.extend({}, $.fn.form_iframe.defaults);
var opts = $.extend(defaults, options);
my.each(function (){
var target, iframe_name, toiframe,
myform = $(this);
if(!myform.is('form'))
return true;
do{
iframe_name = 'iframe_'+((Math.random()*10000000000000000).toString()).slice(0,14);
}while($('iframe[name="'+iframe_name+'"]').size() > 0);
toiframe = $('<iframe form_iframe="1" name="'+iframe_name+'"></iframe>').hide();
myform.attr('target',iframe_name);
myform.after(toiframe);
myform.bind('submit',function (){
var subCou = (isNaN(parseInt($(this).attr('form_iframe-cou'))) ? 1 : (parseInt($(this).attr('form_iframe-cou'))+1));
$(this).attr('form_iframe-cou', subCou);
toiframe.attr('form_iframe-cou', subCou);
});
toiframe.data('myform',myform);
toiframe.bind({"error.form_iframe":function (){
if(!toiframe.is('[form_iframe-cou]')){
return;
}
opts.error(toiframe);
opts.complete(toiframe,'failure');
_my_complete(toiframe, 'failure');
},
"load.form_iframe":function (){
if(!toiframe.is('[form_iframe-cou]')){
return;
}
var retdom = $(this).contents(),
retex = $(retdom).text();
opts.success(retex,toiframe);
opts.complete(toiframe,'success', retex);
_my_complete(toiframe, 'success');
}});
if(opts.isSubmit)
myform.submit();
});
function _my_complete(iframe){
if(opts.isOne)
iframe.remove();
}
return my;
};
$.fn.form_iframe.defaults = {
success: function (){},
error: function (){},
complete:function (){},
isSubmit:false,
isOne:false
};
})(jQuery);