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 相关文章推荐
Use Word to Search for Files
Jun 15 Javascript
javascript获得CheckBoxList选中的数量
Oct 27 Javascript
拖动布局之保存布局页面cookies篇
Oct 29 Javascript
javascript定时保存表单数据的代码
Mar 17 Javascript
JQuery.Ajax之错误调试帮助信息介绍
Jul 04 Javascript
js 模式窗口(模式对话框和非模式对话框)的使用介绍
Jul 17 Javascript
jQuery中[attribute!=value]选择器用法实例
Dec 31 Javascript
js监听input输入框值的实时变化实例
Jan 26 Javascript
Vue 应用中结合vux使用微信 jssdk的方法
Aug 28 Javascript
javascript json对象小技巧之键名作为变量用法分析
Nov 11 Javascript
搭建Vue从Vue-cli到router路由护卫的实现
Nov 14 Javascript
uniapp电商小程序实现订单30分钟倒计时
Nov 01 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
php使用异或实现的加密解密实例
2013/09/04 PHP
php的dl函数用法实例
2014/11/06 PHP
php数组使用规则分析
2015/02/27 PHP
yii插入数据库防并发的简单代码
2017/05/27 PHP
PHP Post获取不到非表单数据的问题解决办法
2018/02/27 PHP
PHP SPL 被遗落的宝石【SPL应用浅析】
2018/04/20 PHP
基于jQuery的烟花效果(运动相关)点击屏幕出烟花
2012/06/14 Javascript
无缝滚动js代码通俗易懂(自写)
2013/06/19 Javascript
js 图片随机不定向浮动的实现代码
2013/07/02 Javascript
jquery dialog open后,服务器端控件失效的快速解决方法
2013/12/19 Javascript
JavaScript通过setTimeout实时显示当前时间的方法
2015/04/16 Javascript
jquery实现美观的导航菜单鼠标提示特效代码
2015/09/06 Javascript
BootStrap点击下拉菜单项后显示一个新的输入框实现代码
2016/05/16 Javascript
基于JavaScript实现的快速排序算法分析
2017/04/14 Javascript
JavaScript实现封闭区域布尔运算的示例代码
2018/06/25 Javascript
JavaScript中构造函数与原型链之间的关系详解
2019/02/25 Javascript
node.js事件轮询机制原理知识点
2019/12/22 Javascript
Python中扩展包的安装方法详解
2017/06/14 Python
python交互式图形编程实例(二)
2017/11/17 Python
Python中django学习心得
2017/12/06 Python
python使用pipeline批量读写redis的方法
2019/02/18 Python
python基于gevent实现并发下载器代码实例
2019/11/01 Python
PyCharm无法引用自身项目解决方式
2020/02/12 Python
python装饰器三种装饰模式的简单分析
2020/09/04 Python
Python高阶函数与装饰器函数的深入讲解
2020/11/10 Python
企业精细化管理实施方案
2014/03/23 职场文书
大学毕业寄语大全
2014/04/10 职场文书
教师读书活动总结
2014/05/07 职场文书
新文化运动的口号
2014/06/21 职场文书
五一促销活动总结
2014/07/01 职场文书
终止劳动合同协议书
2014/10/05 职场文书
基层工作经验证明样本
2014/11/16 职场文书
大学生入党群众意见书
2015/06/02 职场文书
新学期家长寄语2016
2015/12/03 职场文书
Java 中的 Lambda List 转 Map 的多种方法详解
2022/07/07 Java/Android
js 实现验证码输入框示例详解
2022/09/23 Javascript