jQuery 处理表单元素的代码


Posted in Javascript onFebruary 15, 2010

1.获取input类的值: $("input").val();

2.获取textarea类的值: $("textarea").val();

3.获取select类的值:$("select").val();

当表单上含有多个input类(或者textarea类和select类),使用上述方法得到的将是一个数组。当然,你可以给这些控件加上ID,从而对某个特定的控件取值,例如:$("input#myID").val()。

下面将对每一种控件的取值方法做一一介绍:

1. input type="text" 单行文本输入框和input type="password" 密码输入框

$("input").val();2. input type="radio" 单选框

$("input:checked").val(); //使用checked,取被选中的单选框的值3. input type="checkbox" 复选框 (值得注意)

$("input:checked").each(function(index){
$("#result").append($(this).val() + " ");
});
//因为复选框的选择结果通常大于1,所以得到的结果是数组。
//使用.each()方法,可以把选择的值一一取出。
//这里结果将被加入(append)到ID为"result"的段落里4. input type="submit" (表单提交按钮)

取值方法和单行文本输入框的取法相同,但没有什么实际意义。

5. textArea 多行文本输入框

$("textarea").val();6. select 下拉框 (单选和多选)

$("select").val();
//注意:如果是复选,那么得到的结果是用逗号分格的字符串,例如:"选择一,选择二”。注意:

对表单元素取值,通常是发生在表单别递交后,在jQuery我们可以用下面的语句进行判断:
$("form").submit(function(){
$("input").val();
});对表单元素设值,只要把要设置的值作为传递参数即可,例如:$("input").val("3water.com");

Javascript 相关文章推荐
JavaScript在IE和Firefox(火狐)的不兼容问题解决方法小结
Apr 13 Javascript
Angular ng-repeat 对象和数组遍历实例
Sep 14 Javascript
js实时获取窗口大小变化的实例代码
Nov 18 Javascript
原生js封装自定义滚动条
Mar 24 Javascript
JS控件bootstrap suggest plugin使用方法详解
Mar 25 Javascript
微信小程序上滑加载下拉刷新(onscrollLower)分批加载数据(二)
May 11 Javascript
AngularJS实现自定义指令与控制器数据交互的方法示例
Jun 19 Javascript
Angular.js中angular-ui-router的简单实践
Jul 18 Javascript
详解基于vue-router的动态权限控制实现方案
Sep 28 Javascript
ES6 Object属性新的写法实例小结
Jun 25 Javascript
关于layui 下拉列表的change事件详解
Sep 20 Javascript
JavaScript数组类型Array相关的属性与方法详解
Sep 08 Javascript
jQuery 树形结构的选择器
Feb 15 #Javascript
jQuery 处理网页内容的实现代码
Feb 15 #Javascript
JS getMonth()日期函数的值域是0-11
Feb 15 #Javascript
不同浏览器对回车提交表单的处理办法
Feb 13 #Javascript
Jquery iframe内部出滚动条
Feb 11 #Javascript
jquery 问答知识整理
Feb 11 #Javascript
改善你的jQuery的25个步骤 千倍级效率提升
Feb 11 #Javascript
You might like
PHP5 操作MySQL数据库基础代码
2009/09/29 PHP
ThinkPHP3.1新特性之多层MVC的支持
2014/06/19 PHP
用Juery网页选项卡实现代码
2011/06/13 Javascript
Js实现网页键盘控制翻页的方法
2014/10/30 Javascript
node.js中的events.emitter.removeAllListeners方法使用说明
2014/12/10 Javascript
AngularJS 2.0新特性有哪些
2016/02/18 Javascript
利用JS提交表单的几种方法和验证(必看篇)
2016/09/17 Javascript
使用jquery.qrcode.js生成二维码插件
2016/10/17 Javascript
vue.js使用v-model指令实现的数据双向绑定功能示例
2018/05/22 Javascript
解决VUE双向绑定失效的问题
2019/10/29 Javascript
js实现数字滚动特效
2019/12/16 Javascript
Echarts实现多条折线可拖拽效果
2019/12/19 Javascript
[33:42]LGD vs OG 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
[56:20]LGD vs VP Supermajor 败者组决赛 BO3 第三场 6.10
2018/07/04 DOTA
python3访问sina首页中文的处理方法
2014/02/24 Python
理解Python中函数的参数
2015/04/27 Python
简单介绍Python中用于求最小值的min()方法
2015/05/15 Python
如何在Python中编写并发程序
2016/02/27 Python
Python中super函数的用法
2017/11/17 Python
Python实现的归并排序算法示例
2017/11/21 Python
解决Python3 被PHP程序调用执行返回乱码的问题
2019/02/16 Python
Django模板Templates使用方法详解
2019/07/19 Python
Django使用中间件解决前后端同源策略问题
2019/09/02 Python
python无序链表删除重复项的方法
2020/01/17 Python
tensorflow实现二维平面模拟三维数据教程
2020/02/11 Python
pytorch 实现在一个优化器中设置多个网络参数的例子
2020/02/20 Python
Jupyter Notebook 实现正常显示中文和负号
2020/04/24 Python
Python如何将字符串转换为日期
2020/07/31 Python
Python爬虫制作翻译程序的示例代码
2021/02/22 Python
css3加js做一个简单的3D行星运转效果实例代码
2017/01/18 HTML / CSS
社会实践感言
2014/01/25 职场文书
关于抽烟的检讨书
2014/02/25 职场文书
关于青春的演讲稿
2014/05/05 职场文书
4s店活动策划方案
2014/08/25 职场文书
教师党的群众路线教育实践活动个人整改方案
2014/10/31 职场文书
 python中的元类metaclass详情
2022/05/30 Python