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 相关文章推荐
js控制滚动条缓慢滚动到顶部实现代码
Mar 20 Javascript
Knockout visible绑定使用方法
Nov 15 Javascript
js 限制input只能输入数字、字母和汉字等等
Dec 18 Javascript
调用jQuery滑出效果时闪烁的解决方法
Mar 27 Javascript
浅谈JS原型对象和原型链
Mar 02 Javascript
BootstrapTable与KnockoutJS相结合实现增删改查功能【一】
May 10 Javascript
Javascript 实现计算器时间功能详解及实例(二)
Jan 08 Javascript
Vue+Element UI+Lumen实现通用表格分页功能
Feb 02 Javascript
es6数据变更同步到视图层的方法
Mar 04 Javascript
HTML+JavaScript实现扫雷小游戏
Sep 30 Javascript
echarts实现折线图的拖拽效果
Dec 19 Javascript
JavaScript this关键字指向常用情况解析
Sep 02 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
php下通过curl抓取yahoo boss 搜索结果的实现代码
2011/06/10 PHP
用Zend Studio+PHPnow+Zend Debugger搭建PHP服务器调试环境步骤
2014/01/19 PHP
php编程每天必学之表单验证
2016/03/01 PHP
php简单的上传类分享
2016/05/15 PHP
深入理解PHP之源码目录结构与功能说明
2016/06/01 PHP
PHP中explode函数和split函数的区别小结
2016/08/24 PHP
PHP实现简易计算器功能
2020/08/28 PHP
在浏览器窗口上添加遮罩层的方法
2012/11/12 Javascript
jQuery $.data()方法使用注意细节
2012/12/31 Javascript
7个JS基础知识总结
2014/03/05 Javascript
对于Form表单reset方法的新认识
2014/03/05 Javascript
javascript Array 数组常用方法
2015/04/05 Javascript
详细分析JavaScript变量类型
2015/07/08 Javascript
jquery实现简单合拢与展开网页面板的方法
2015/09/01 Javascript
配置Grunt的Task时通配符支持和动态生成文件名问题
2015/09/06 Javascript
bootstrap datetimepicker2.3.11时间插件使用
2016/11/19 Javascript
jQuery简单获取DIV和A标签元素位置的方法
2017/02/07 Javascript
vue click.stop阻止点击事件继续传播的方法
2018/09/04 Javascript
微信小程序如何修改本地缓存key中单个数据的详解
2019/04/26 Javascript
详解微信小程序的不同函数调用的几种方法
2019/05/08 Javascript
监控微信小程序中的慢HTTP请求过程详解
2019/07/05 Javascript
微信小程序修改数组长度的问题的解决
2019/12/17 Javascript
跟老齐学Python之用while来循环
2014/10/02 Python
Python实现备份MySQL数据库的方法示例
2018/01/11 Python
matlab中实现矩阵删除一行或一列的方法
2018/04/04 Python
python 划分数据集为训练集和测试集的方法
2018/12/11 Python
python之Flask实现简单登录功能的示例代码
2018/12/24 Python
python使用 cx_Oracle 模块进行查询操作示例
2019/11/28 Python
python Opencv计算图像相似度过程解析
2019/12/03 Python
Python实现手机号自动判断男女性别(实例解析)
2019/12/22 Python
利用python实现凯撒密码加解密功能
2020/03/31 Python
Hotels.com中国区:好订网
2016/08/18 全球购物
学习保证书范文
2014/04/30 职场文书
英语自我介绍演讲稿
2014/09/01 职场文书
学校节水倡议书
2015/04/29 职场文书
创业计划书之密室逃脱
2019/11/08 职场文书