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 相关文章推荐
找到一点可怜的关于dojo资料,谢谢作者!
Dec 06 Javascript
EXT中xtype的含义分析
Jan 07 Javascript
删除select中所有option选项jquery代码
Aug 12 Javascript
使用jquery.form.js实现图片上传的方法
May 05 Javascript
JavaScript实现邮箱地址自动匹配功能代码
Nov 28 Javascript
微信开发 JS-SDK 6.0.2 经常遇到问题总结
Dec 08 Javascript
Vue的Flux框架之Vuex状态管理器
Jul 30 Javascript
bootstrap switch开关组件使用方法详解
Aug 22 Javascript
vue中使用gojs/jointjs的示例代码
Aug 24 Javascript
使用VueCli3+TypeScript+Vuex一步步构建todoList的方法
Jul 25 Javascript
vux-scroller实现移动端上拉加载功能过程解析
Oct 08 Javascript
jQuery实现的图片点击放大缩小功能案例
Jan 02 jQuery
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防范SQL注入的具体方法详解(测试通过)
2014/05/09 PHP
PHP中cookie和session的区别实例分析
2014/08/28 PHP
教你如何开启shopnc b2b2c 伪静态
2014/10/21 PHP
Mac系统完美安装PHP7详细教程
2017/06/06 PHP
Node.js:Windows7下搭建的Node.js服务(来玩玩服务器端的javascript吧,这可不是前端js插件)
2011/06/27 Javascript
JavaScript 模式之工厂模式(Factory)应用介绍
2012/11/15 Javascript
jQuery动态添加、删除元素的方法
2014/01/09 Javascript
jQuery实现不断闪烁文字的方法
2015/05/15 Javascript
javascript拖拽应用实例(二)
2016/03/25 Javascript
vue 简单自动补全的输入框的示例
2018/03/12 Javascript
webpack+vue-cli项目中引入外部非模块格式js的方法
2018/09/28 Javascript
Vue实现购物车的全选、单选、显示商品价格代码实例
2019/05/06 Javascript
Typescript 中的 interface 和 type 到底有什么区别详解
2019/06/18 Javascript
微信小程序如何实现五星评价功能
2019/10/15 Javascript
Vue中keep-alive的两种应用方式
2020/07/15 Javascript
Python爬虫抓取手机APP的传输数据
2016/01/22 Python
浅谈python 线程池threadpool之实现
2017/11/17 Python
Python multiprocess pool模块报错pickling error问题解决方法分析
2019/03/20 Python
Python OpenCV调用摄像头检测人脸并截图
2020/08/20 Python
Django对接支付宝实现支付宝充值金币功能示例
2019/12/17 Python
tensorflow之获取tensor的shape作为max_pool的ksize实例
2020/01/04 Python
TFRecord格式存储数据与队列读取实例
2020/01/21 Python
利用python+ffmpeg合并B站视频及格式转换的实例代码
2020/11/24 Python
墨尔本最受欢迎的复古风格品牌:Princess Highway
2018/12/21 全球购物
Saks Fifth Avenue澳洲/亚太地区:萨克斯第五大道精品百货店
2019/06/09 全球购物
2014年清明节寄语
2014/04/03 职场文书
领导干部保密承诺书
2014/08/30 职场文书
党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
英文道歉信
2015/01/20 职场文书
人事聘任通知
2015/04/21 职场文书
2015年推普周活动方案
2015/05/06 职场文书
2015年行政管理人员工作总结
2015/10/15 职场文书
Python 用户输入和while循环的操作
2021/05/23 Python
vue使用Google Recaptcha验证的实现示例
2021/08/23 Vue.js
微信小程序结合ThinkPHP5授权登陆后获取手机号
2021/11/23 PHP
从原生JavaScript到React深入理解
2022/07/23 Javascript