将form以ajax方式提交

前端之家收集整理的这篇文章主要介绍了将form以ajax方式提交前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
<!DOCTYPE html> <html> <head> <Meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <script src="/js/jquery-1.6.2.min.js"></script> <script> jQuery.fn.extend({ ajaxForm : function (fn){ var data = {'ajax':1}; $(this).find('input[type="text"],input[type="password"],input[type="hidden"],textarea,select:not([multiple])').each(function(i){ data[this.name] = this.value; }); $(this).find('select[multiple]').each(function(i){ var vals = []; $(this).find('option:selected').each(function(j){ vals[j] = this.value; }); data[this.name] = vals; }); $(this).find('input[type="radio"],input[type="checkBox"]').each(function(i){ var name = this.name.replace('[]',''); data[name] = '';//设置默认为空 }); $(this).find('input[type="radio"]:checked,input[type="checkBox"]:checked').each(function(i){ var name = this.name.replace('[]','['+i+']'); data[name] = this.value; }); $.ajax({ type: this.method,url: this.action,data: data,dataType: 'json',error: function(error){if(typeof(fn)!='undefined')fn.call(this,{'error':error})},success: function(json){if(typeof(fn)!='undefined')fn.call(this,json)} }); return false; } }); </script> </head> <body> <form action="/" onsubmit="return $(this).ajaxForm(function(json){alert(json)})"> <input name="test" type="text" /> <input type="submit"/> </form> </body> </html> 原文链接:https://www.f2er.com/ajax/166177.html

猜你在找的Ajax相关文章