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 相关文章推荐
一个简单的js动画效果代码
Jul 20 Javascript
基于Jquery的标签智能验证实现代码
Dec 27 Javascript
AngularJS表单编辑提交功能实例
Feb 13 Javascript
Bootstrap每天必学之js插件
Nov 30 Javascript
基于jQuery的网页影音播放器jPlayer的基本使用教程
Mar 08 Javascript
浅谈js中test()函数在正则中的使用
Aug 19 Javascript
微信小程序 购物车简单实例
Oct 24 Javascript
Vue文件配置全局变量的实例
Sep 06 Javascript
解决vue attr取不到属性值的问题
Sep 18 Javascript
vue中使用codemirror的实例详解
Nov 01 Javascript
详解Webstorm 下的Angular2.0开发之路(图文)
Dec 06 Javascript
JavaScript实现电灯开关小案例
Mar 30 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
ThinkPHP中公共函数路径和配置项路径的映射分析
2014/11/22 PHP
PHP实现股票趋势图和柱形图
2015/02/07 PHP
php实现html标签闭合检测与修复方法
2015/07/09 PHP
PHP标准库 (SPL)――Countable用法示例
2020/06/05 PHP
表单提交验证类
2006/07/14 Javascript
jQuery使用手册之三 CSS操作
2007/03/24 Javascript
Open and Print a Word Document
2007/06/15 Javascript
Javascript读取cookie函数代码
2010/10/16 Javascript
Jquery带搜索框的下拉菜单
2013/05/06 Javascript
根据选择不同的下拉值出现相对应的文本输入框
2013/08/01 Javascript
NodeJS制作爬虫全过程(续)
2014/12/22 NodeJs
jquery实现鼠标滑过小图查看大图的方法
2015/07/20 Javascript
详解javascript事件冒泡
2016/01/09 Javascript
获取IE浏览器Cookie信息的方法
2017/01/23 Javascript
zTree获取当前节点的下一级子节点数实例
2017/09/05 Javascript
EasyUI Tree树组件无限循环的解决方法
2017/09/27 Javascript
json数据传到前台并解析展示成列表的方法
2018/08/06 Javascript
解决在vue项目中webpack打包后字体不生效的问题
2018/09/01 Javascript
详解webpack打包后如何调试的方法步骤
2018/11/07 Javascript
Vuepress 搭建带评论功能的静态博客的实现
2019/02/17 Javascript
Vue 实现前进刷新后退不刷新的效果
2019/06/14 Javascript
JsonServer安装及启动过程图解
2020/02/28 Javascript
深入理解 ES6中的 Reflect用法
2020/07/18 Javascript
Vue与React的区别和优势对比
2020/12/18 Vue.js
浅谈Python爬取网页的编码处理
2016/11/04 Python
python分割一个文本为多个文本的方法
2019/07/22 Python
Jupyter打开图形界面并画出正弦函数图像实例
2020/04/24 Python
Python3如何使用tabulate打印数据
2020/09/25 Python
Django限制API访问频率常用方法解析
2020/10/12 Python
e路東瀛(JAPANiCAN)香港:日本旅游、日本酒店和温泉旅馆预订
2018/11/21 全球购物
偷看我的初中毕业鉴定
2014/01/29 职场文书
体育教师自我鉴定
2014/02/12 职场文书
房屋出售协议书
2014/04/10 职场文书
2015年学雷锋活动总结
2015/02/06 职场文书
民政工作个人总结
2015/02/28 职场文书
Mysql排查分析慢sql之explain实战案例
2022/04/19 MySQL