首页
Web开发
Windows程序
编程语言
数据库
移动开发
系统相关
微信
其他好文
会员
首页
>
Web开发
> 详细
jQuery之ajaxForm提交表单
时间:
2016-08-17 08:59:23
阅读:
150
评论:
0
收藏:
0
[点我收藏+]
标签:
1.jQuery的设计非常优雅,其源代码亦给人以美感,利用jQuery框架写出来的js既简练又能完美跨浏览器。
2.jquery form插件是基于jQuery开发的一套能够利用ajax技术提交form的框架。
3.无论是jQuery,还是jquery form 都是老外写的。
4.通常的jQuery ajax提交写法如下:
5. $.post("../user/user.do?d=checkPasswordOnUpdateByAjax",{old_password:old_password.val()},function(xml){
6. });
7.其中:{old_password:old_password.val()}是挂的参数,为json串格式。如果只有几个参数,这种方法还是值得一用的,如果有几十个,从软件可维护性的角度去考虑,用这种方法实在不敢恭维。我曾经写过一个根据form的页内数据元素生成Json串的方法。但是对自己写的东西总觉得不够满意,有没有一种可以提交form数据的插件呢,google一下,输入关键字 jquery form plugin 。我很荣幸的搜到了我需要的东西,既然已经有轮子,自己发明的轮子暂时先放弃。从此我对jQuery form 的依赖及使用变得一发不可收拾。在我做的项目中大量的使用了该插件进行ajax数据提交。
8.把jquery form的相关文件导入页面
9.<script language="javaScript" src="../static/js/base/jquery.js"></script> <!--jquery 包-->
10.<script language="javaScript" src="../static/js/base/jquery.form.js"></script> <!--jquery form包-->
11.且二者顺序不可以放反,因为文件是自上而下解析的。
12.function submitForm(){
13. var form = $("form[name=MsgForm]");
14. if($("input[name=user_name]").val() == null || $("input[name=user_name]").val() == ""){//这里是如果user_name为空则用ajaxform提交,否则按照传统方式提交。
15. //ajax form post
16. var options = {success:showResponse,resetForm:true,url:"../user/msg.do?d=sendMsgByAjax"};
17. form.ajaxForm(options);
18. return;
19. }
20. form.submit();// 传统form提交
21.}
22.function showResponse(xml){//回调函数
23. if(1 == xml){
24. alert("信息发送成功!");
25. }else{
26. alert("信息发送失败!");
27. }
28.}
29.注意:
30.xml的值1或者-1是后台用response打出来的。如下:
31.response.setContentType("text/html;charSet=UTF-8");
32.response.setCharacterEncoding("UTF-8");
33.PrintWriter pw = response.getWriter();
34.pw.println("1");
35.url就是form表单要提交到的地址,当然若不指定,会自动使用form里action的值。
36.success的值也是函数,就是提交表单处理完后要做的事
jQuery之ajaxForm提交表单
标签:
原文地址:http://www.cnblogs.com/lxcmyf/p/5778560.html
踩
(
0
)
赞
(
0
)
举报
评论
一句话评论(
0
)
登录后才能评论!
分享档案
更多>
2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
更多
36.VUE — 认识 Webpack 和 安装
2021-07-28
【PHP】上传图片翻转问题
2021-07-28
php对数字进行万。亿的转化
2021-07-28
五个 .NET 性能小贴士
2021-07-28
Three.js中显示坐标轴、平面、球体、四方体
2021-07-28
.net 5+ 知新:【1】 .Net 5 基本概念和开发环境搭建
2021-07-27
1.html,css
2021-07-27
基于Docker搭建 Php-fpm + Nginx 环境
2021-07-27
nginx + http + svn
2021-07-27
kubernets kube-proxy的代理 iptables和ipvs
2021-07-26
友情链接
兰亭集智
国之画
百度统计
站长统计
阿里云
chrome插件
新版天听网
关于我们
-
联系我们
-
留言反馈
© 2014
mamicode.com
版权所有 联系我们:gaon5@hotmail.com
迷上了代码!