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 new Date().valueOf()的作用与时间戳由来详解
Apr 24 Javascript
JQuery调webservice实现邮箱验证(检测是否可用)
May 21 Javascript
js setTimeout 参数传递使用介绍
Aug 13 Javascript
js中string转int把String类型转化成int类型
Aug 13 Javascript
JavaScript的jQuery库中function的存在和参数问题
Aug 13 Javascript
基于Node.js的JavaScript项目构建工具gulp的使用教程
May 20 Javascript
javascript经典特效分享 手风琴、轮播图、图片滑动
Sep 14 Javascript
Java  Spring 事务回滚详解
Oct 17 Javascript
微信小程序 下拉列表的实现实例代码
Mar 08 Javascript
怎么理解wx.navigateTo的events参数使用详情
May 18 Javascript
jQuery中getJSON跨域原理的深入讲解
Sep 02 jQuery
Vue利用localStorage本地缓存使页面刷新验证码不清零功能的实现
Sep 04 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读取配置文件类实例(可读取ini,yaml,xml等)
2015/07/28 PHP
PHP attributes()函数讲解
2019/02/03 PHP
php tpl模板引擎定义与使用示例
2019/08/09 PHP
JScript中使用ADODB.Stream判断文件编码的代码
2008/06/09 Javascript
避免 showModalDialog 弹出新窗体的原因分析
2010/05/31 Javascript
js限制文本框为整数和货币的函数代码
2010/10/13 Javascript
JavaScript中创建对象和继承示例解读
2014/02/12 Javascript
jQuery使用之设置元素样式用法实例
2015/01/19 Javascript
webuploader模态框ueditor显示问题解决方法
2016/12/27 Javascript
javascript解析ajax返回的xml和json格式数据实例详解
2017/01/05 Javascript
详解webpack babel的配置
2018/01/09 Javascript
详解适配器在JavaScript中的体现
2018/09/28 Javascript
微信小程序使用canvas的画图操作示例
2019/01/18 Javascript
微信小程序数据统计和错误统计的实现方法
2019/06/26 Javascript
node创建Vue项目步骤详解
2020/03/06 Javascript
微信小程序获取当前时间及星期几的实例代码
2020/09/20 Javascript
Ant design vue table 单击行选中 勾选checkbox教程
2020/10/24 Javascript
基于js实现的图片拖拽排序源码实例
2020/11/04 Javascript
JS如何监听div的resize事件详解
2020/12/03 Javascript
跟老齐学Python之集成开发环境(IDE)
2014/09/12 Python
Python魔术方法详解
2015/02/14 Python
python判断字符串编码的简单实现方法(使用chardet)
2016/07/01 Python
Python基于回溯法子集树模板实现图的遍历功能示例
2017/09/05 Python
python爬取指定微信公众号文章
2018/12/20 Python
Python实现给PDF添加水印的方法
2021/01/25 Python
Html5 Canvas动画基础碰撞检测的实现
2018/12/06 HTML / CSS
秘鲁购物网站:Linio秘鲁
2017/04/07 全球购物
简单说说tomcat的配置
2013/05/28 面试题
教师求职信范文分享
2013/12/27 职场文书
班会关于环保演讲稿
2013/12/29 职场文书
大学同学十年聚会感言
2014/02/21 职场文书
联片教研活动总结
2014/07/01 职场文书
迎新生标语大全
2014/10/06 职场文书
布达拉宫的导游词
2015/02/02 职场文书
安全生产会议制度
2015/08/06 职场文书
PHP正则表达式之RCEService回溯
2022/04/11 PHP