表单插件——form
表单插件——form
通过表单form插件,调用ajaxForm()
方法,实现ajax方式向服务器提交表单数据,并通过方法中的options对象获取服务器返回数据,调用格式如下:
$(form). ajaxForm ({options})
其中form参数表示表单元素名称;options是一个配置对象,用于在发送ajax请求过程,设置发送时的数据和参数。
![](/assets/blank.gif)
![](/assets/blank.gif)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <title>表单插件</title> 5 <script type="text/javascript" src="http://www.imooc.com/data/jquery-1.8.2.min.js"></script> 6 <script type="text/javascript" src="http://www.imooc.com/data/jquery.form.js"></script> 7 <style> 8 #divtest 9 { 10 width: 282px; 11 } 12 #divtest .title 13 { 14 padding: 8px; 15 background-color: Blue; 16 color: #fff; 17 height: 23px; 18 line-height: 23px; 19 font-size: 15px; 20 font-weight: bold; 21 } 22 #divtest .content 23 { 24 padding: 8px 0px; 25 background-color: #fff; 26 font-size: 13px; 27 } 28 #divtest .content .tip 29 { 30 text-align:center; 31 border:solid 1px #ccc; 32 background-color:#eee; 33 margin:20px 0px; 34 padding:8px; 35 } 36 .fl 37 { 38 float: left; 39 } 40 .fr 41 { 42 float: right; 43 } 44 </style> 45 </head> 46 47 <body> 48 <form id="frmV" method="post" action="#"> 49 <div id="divtest"> 50 <div class="title"> 51 <span class="fl">个人信息页</span> 52 <span class="fr"> 53 <input id="btnSubmit" type="submit" value="提交" /> 54 </span> 55 </div> 56 <div class="content"> 57 <span class="fl">用户名:</span><br /> 58 <input id="user" name="user" type="text" /><br /> 59 <span class="fl">昵称:</span><br /> 60 <input id="nick" name="nick" type="text" /> 61 <div class="tip"></div> 62 </div> 63 </div> 64 </form> 65 66 <script type="text/javascript"> 67 $(function () { 68 var options = { 69 url: "9-2.php", 70 target: ".tip" 71 } 72 $("#frmV").ajaxForm(options); 73 }); 74 </script> 75 </body> 76 </html>
View Code
![](/assets/blank.gif)
![](/assets/blank.gif)
1 <?php 2 $user = $_POST['user']; 3 $nick = $_POST['nick']; 4 echo "用户名:".$user."昵称:".$nick;
View Code
表单插件——form相关推荐
- jQuery 表单插件 -- Form
1.Form 插件简介 jQuery Form 插件是一个优秀的 Ajax 表单插件,可以非常容易地.无侵入地升级 HTML 表单以支持 Ajax. jQuery Form 有两个核心方法 --- a ...
- JQuery表单插件Form
Form 插件简介 JQuery Form 插件是一个优秀的Ajax表单插件.它有两个核心方法 ajaxForm()和ajaxSubmit(),还包括一些方法: formToArray().formS ...
- 对 Jquery 表单插件 Form.js 2.12 的调整
Form插件,支持Ajax,支持Ajax文件上传,功能强大,基本满足日常应用, 但在使用过程中,发现以下两点不足,并进行了调整,在此分享给大家 1.对属性:beforeSubmit 进行调整 原版js ...
- jQuery Form Plugin (jquery表单插件)
jQuery表单插件 jQuery.form 这是一个全面支持表单的jQuery插件,支持文件上传,包含以下一些方法: -ajaxForm -ajaxSubmit - formToArray - fo ...
- Form表单插件jquery.form.js
jQuery Form插件是一个优秀的Ajax表单插件,可以非常容易地.无侵入地升级HTML表单以支持Ajax. jQuery Form有两个核心方法 -- ajaxForm() 和 ajaxSubm ...
- wordpress安装jquery插件失败_Contact Form 7插件_WordPress表单插件安装使用教程
Contact Form 7插件用在 wordpress联系表单中,获取访客留言及询盘内容,在表单插件中是很流行的,很多外贸网站和企业网站都会使用 Contact Form 7插件来与访客沟通信息. ...
- jQuery插件 -- Form表单插件jquery.form.js
jQuery Form插件是一个优秀的Ajax表单插件,可以非常容易地.无侵入地升级HTML表单以支持Ajax.jQuery Form有两个核心方法 -- ajaxForm() 和 ajaxSubmi ...
- contactform7 ajax,Contact Form 7 最强大的wordpress表单插件
10年前 (2011-09-02) | 54,093 views | 54 条评论 | 本文共2961个字 朗读这篇文章 不得不介绍一下这款插件Contact Form 7,真的是很强大,在还没用上C ...
- jQuery验证表单插件——jquery-validation
jQuery验证表单插件--jquery-validation The jQuery Validation Plugin provides drop-in validation for your ex ...
最新文章
- 玉米田Corn Fields
- java 网络编程简单聊天_网络编程之 TCP 实现简单聊天
- Vue中的 ref 和 $refs
- html元素嵌套与并列,HTML的元素嵌套规则
- excel 某个单元格不是等于空值_这些稀奇古怪的符号,却是Excel高手们常玩的!...
- 多个表添加几个相同的字段
- Python笔记-类装饰器
- 7-Spring Boot的安全管理
- 在开发过程中调试报表插件详细教程
- 编译在arm版本的Valgrind-转
- Python学习入门基础教程(learning Python)--5.7 Python文件数据记录存储与处理
- 【数据结构和算法】拓扑排序(附leetcode题 207/210 课程表)
- 键盘按下某键 停止运行java_Java:按下“Q”键后终止while循环
- Junit + Mockito 使用资料整理
- jpa的批量修改_jpa批量处理
- [codeforces 1293A] ConneR and the A.R.C. Markland-N 不超时的二分/无限长数组map+桶排序
- 数据库必看--WYL篇
- 计算机开机后无法网络拨号怎样处理,拨号上网时电脑假死的原因和解决方法
- Dao层和Service层的区别
- TMT/MOBIE成像光谱仪的概念设计阶段杂散光分析
热门文章
- 超外差半导体收音机:各个元器件的作用,如何进行调试,以及工作原理
- 分享||元器件类别分类的标准
- JavaEE通过路径或域名获取资源
- 0.96寸OLED显示汉字,数字,英文,图片,GIF动画+取模软件使用+代码解析
- SpringCloud工程搭建之配置中心服务搭建(可选)
- 深度补全延伸系列——1——SPN
- 明明网速测试是正常,为什么上网还会卡?
- SystemUI分析
- 【电源专题】LDO的电源抑制比(PSRR)
- IEInspector.HTTP.Analyzer.Full.Edition.v7.0.1.418.Incl.Keymaker-ZWT