jquery获取input表单值的代码


Posted in Javascript onApril 19, 2010

jquery取radio单选按钮的值
$("input[name='items']:checked").val();
jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关
获取一组radio被选中项的值
var item = $('input[name=items][checked]').val();
获取select被选中项的文本
var item = $("select[name=items] option[selected]").text();
select下拉框的第二个元素为当前选中值
$('#select_id')[0].selectedIndex = 1;
radio单选组的第二个元素为当前选中值
$('input[name=items]').get(1).checked = true;

获取值:

文本框,文本区域:$("#txt").attr("value");
多选框checkbox:$("#checkbox_id").attr("value");
单选组radio: $("input[type=radio][checked]").val();
下拉框select: $('#sel').val();

控制表单元素:
文本框,文本区域:$("#txt").attr("value",'');//清空内容
$("#txt").attr("value",'11');//填充内容

多选框checkbox: $("#chk1").attr("checked",'');//不打勾
$("#chk2").attr("checked",true);//打勾
if($("#chk1").attr('checked')==undefined) //判断是否已经打勾

单选组radio: $("input[type=radio]").attr("checked",'2');//设置value=2的项目为当前选中项
下拉框select: $("#sel").attr("value",'-sel3');//设置value=-sel3的项目为当前选中项
$("<option value='1'>1111</option><option value='2'>2222</option>").appendTo("#sel")//添加下拉框的option
$("#sel").empty();//清空下拉框

刚开始接触jquery,很多东西不熟悉
在用$("#id")来获得页面的input元素的时候,发现$("#id").value不能取到值

后来终于在伟大的百度帮助下,找到了问题的原因:
$("")是一个jquery对象,而不是一个dom element

value是dom element的属性

jquery与之对应的是val

val() :获得第一个匹配元素的当前值。

val(val):设置每一个匹配元素的值。

所以,代码应该这样写:

取值:val = $("#id")[0].value;
赋值:
$("#id")[0].value = "new value";
或者$("#id").val("new value");

或者这样也可以:val = $("#id").attr("value");

Javascript 相关文章推荐
在IE,Firefox,Safari,Chrome,Opera浏览器上调试javascript
Dec 02 Javascript
jQuery html() in Firefox (uses .innerHTML) ignores DOM changes
Mar 05 Javascript
jquery单选框radio绑定click事件实现方法
Jan 14 Javascript
JS封装cookie操作函数实例(设置、读取、删除)
Nov 17 Javascript
JS数组操作(数组增加、删除、翻转、转字符串、取索引、截取(切片)slice、剪接splice、数组合并)
May 20 Javascript
JavaScript中的冒泡排序法
Aug 03 Javascript
angular.js指令中transclude选项及ng-transclude指令详解
May 24 Javascript
vue-resource拦截器设置头信息的实例
Oct 27 Javascript
实例详解BootStrap的动态模态框及静态模态框
Aug 13 Javascript
JS使用canvas中的measureText方法测量字体宽度示例
Feb 02 Javascript
详解如何修改 node_modules 里的文件
May 22 Javascript
JS倒计时两种实现方式代码实例
Jul 27 Javascript
编写高性能的JavaScript 脚本的加载与执行
Apr 19 #Javascript
jquery 关键字“拖曳搜索”之“拖曳”以及 图片“提示自适应放大”效果 的实现
Apr 18 #Javascript
jquery 新手学习常见问题解决方法
Apr 18 #Javascript
javascript 设计模式之单体模式 面向对象学习基础
Apr 18 #Javascript
js 获取子节点函数 (兼容FF与IE)
Apr 18 #Javascript
几个比较实用的JavaScript 测试及效验工具
Apr 18 #Javascript
javascript JSON操作入门实例
Apr 16 #Javascript
You might like
linux下为php添加curl扩展的方法
2011/07/29 PHP
php中将指针移动到数据集初始位置的实现代码[mysql_data_seek]
2012/11/01 PHP
PHP实现数据库统计时间戳按天分组输出数据的方法
2017/10/10 PHP
JQuery 弹出框定位实现方法
2010/12/02 Javascript
基于jQuery的烟花效果(运动相关)点击屏幕出烟花
2012/06/14 Javascript
firefox浏览器不支持innerText的解决方法
2013/08/07 Javascript
jQuery - css() 方法示例详解
2014/01/16 Javascript
简单谈谈javascript Date类型
2015/09/06 Javascript
JS基于myFocus库实现各种功能的tab选项卡切换效果
2015/09/19 Javascript
JQuery异步加载PartialView的方法
2016/06/07 Javascript
基于AngularJS实现iOS8自带的计算器
2016/09/12 Javascript
Bootstrap分页插件之Bootstrap Paginator实例详解
2016/10/15 Javascript
微信小程序开发实战教程之手势解锁
2016/11/18 Javascript
JQuery省市联动效果实现过程详解
2020/05/08 jQuery
[02:17]DOTA2亚洲邀请赛 RAVE战队出场宣传片
2015/02/07 DOTA
python数据结构之图深度优先和广度优先实例详解
2015/07/08 Python
最大K个数问题的Python版解法总结
2016/06/16 Python
Python的SimpleHTTPServer模块用处及使用方法简介
2018/01/22 Python
Python DataFrame 设置输出不显示index(索引)值的方法
2018/06/07 Python
用python解压分析jar包实例
2020/01/16 Python
python递归调用中的坑:打印有值, 返回却None
2020/03/16 Python
Django crontab定时任务模块操作方法解析
2020/09/10 Python
HTML5中视频音频的使用详解
2017/07/07 HTML / CSS
资生堂美国官网:Shiseido美国
2016/09/02 全球购物
全球最大的跑步用品商店:Road Runner Sports
2016/09/11 全球购物
软件缺陷的分类都有哪些
2014/08/22 面试题
酒店工作职员求职简历的自我评价
2013/10/23 职场文书
化学实验员岗位职责
2013/12/28 职场文书
公司离职证明范本
2014/01/13 职场文书
考试作弊检讨书大全
2014/02/18 职场文书
铲车司机岗位职责
2014/03/15 职场文书
公务员政审单位鉴定材料
2014/05/16 职场文书
欢迎横幅标语
2014/06/17 职场文书
农村党支部书记党群众路线四风问题整改措施
2014/09/26 职场文书
2015年幼儿园教育教学工作总结
2015/05/25 职场文书
Redis Cluster 字段模糊匹配及删除
2021/05/27 Redis