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判别浏览器种类以及IE版本的几种方法小结
Aug 02 Javascript
如何让页面加载完成后执行js
Jun 26 Javascript
ExtJS4中使用mixins实现多继承示例
Dec 03 Javascript
jquery衣服颜色选取插件效果代码分享
Aug 28 Javascript
JavaScript各类型的关系图解
Oct 16 Javascript
jquery采用oop模式class类的使用示例
Jan 22 Javascript
微信小程序 网络API发起请求详解
Nov 09 Javascript
vue2.x+webpack快速搭建前端项目框架详解
Nov 30 Javascript
Vue.directive()的用法和实例详解
Mar 04 Javascript
Vue注册组件命名时不能用大写的原因浅析
Apr 25 Javascript
vue自定义js图片碎片轮播图切换效果的实现代码
Apr 28 Javascript
基于Vue全局组件与局部组件的区别说明
Aug 11 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
相对路径转化成绝对路径
2007/04/10 PHP
php的大小写敏感问题整理
2011/12/29 PHP
PHP内核探索:变量存储与类型使用说明
2014/01/30 PHP
Symfony2学习笔记之控制器用法详解
2016/03/17 PHP
PHP邮箱验证示例教程
2016/06/01 PHP
Laravel 前端资源配置教程
2019/10/18 PHP
javascript中的对象和数组的应用技巧
2007/01/07 Javascript
javascript转换字符串为dom对象(字符串动态创建dom)
2010/05/10 Javascript
js 动态为textbox添加下拉框数据源的方法
2014/04/24 Javascript
extjs_02_grid显示本地数据、显示跨域数据
2014/06/23 Javascript
nodejs multer实现文件上传与下载
2017/05/10 NodeJs
ionic3双击返回退出应用的方法
2019/09/17 Javascript
vue配置多代理服务接口地址操作
2020/09/08 Javascript
解决vant-UI库修改样式无效的问题
2020/11/03 Javascript
[05:56]第十六期——新进3大C之小兔基
2014/06/24 DOTA
[02:46]完美世界DOTA2联赛PWL DAY4集锦
2020/11/03 DOTA
python实现聚类算法原理
2018/02/12 Python
Ubuntu下使用Python实现游戏制作中的切分图片功能
2018/03/30 Python
pandas全表查询定位某个值所在行列的方法
2018/04/12 Python
Django+zTree构建组织架构树的方法
2019/08/21 Python
python线程信号量semaphore使用解析
2019/11/30 Python
15行Python代码实现免费发送手机短信推送消息功能
2020/02/27 Python
全网首秀之Pycharm十大实用技巧(推荐)
2020/04/27 Python
python 删除excel表格重复行,数据预处理操作
2020/07/06 Python
Python爬取某平台短视频的方法
2021/02/08 Python
NYX Professional Makeup英国官网:美国平价专业彩妆品牌
2019/11/13 全球购物
Ooni英国官网:披萨烤箱
2020/05/31 全球购物
期末考试动员演讲稿
2014/01/10 职场文书
领导检查欢迎词
2014/01/14 职场文书
学历公证书范本
2014/04/09 职场文书
员工安全承诺书
2014/05/22 职场文书
个人作风建设心得体会
2014/10/22 职场文书
基层党支部整改方案
2014/10/25 职场文书
趣味运动会赞词
2015/07/22 职场文书
Spring boot应用启动后首次访问很慢的解决方案
2021/06/23 Java/Android
JavaScript实现队列结构过程
2021/12/06 Javascript