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 相关文章推荐
arguments对象
Nov 20 Javascript
javascript 打开页面window.location和window.open的区别
Mar 17 Javascript
javascript cookies操作集合
Apr 12 Javascript
EasyUI中的tree用法介绍
Nov 01 Javascript
JS截取字符串常用方法整理及使用示例
Oct 18 Javascript
jquery 鼠标滑动显示详情应用示例
Jan 24 Javascript
Javascript中prototype的使用详解
Jun 18 Javascript
第九篇Bootstrap导航菜单创建步骤详解
Jun 21 Javascript
JavaScript中数组常见操作技巧
Sep 01 Javascript
Vue下滚动到页面底部无限加载数据的示例代码
Apr 22 Javascript
微信小程序实现手指触摸画板
Jul 09 Javascript
Vue基于iview实现登录密码的显示与隐藏功能
Mar 06 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
ThinkPHP让分页保持搜索状态的方法
2014/07/02 PHP
thinkphp实现上一篇与下一篇的方法
2014/12/08 PHP
PHP+jQuery+Ajax实现用户登录与退出
2015/04/27 PHP
PHP实现的mysql操作类【MySQL与MySQLi方式】
2017/10/07 PHP
用js脚本控制asp.net下treeview的NodeCheck的实现代码
2010/03/02 Javascript
javascript full screen 全屏显示页面元素的方法
2013/09/27 Javascript
JavaScript前补零操作实例
2015/03/11 Javascript
深入理解JavaScript中的call、apply、bind方法的区别
2016/05/30 Javascript
jQuery+ajax实现滚动到页面底部自动加载图文列表效果(类似图片懒加载)
2016/06/07 Javascript
详解Vue2.0之去掉组件click事件的native修饰
2017/04/20 Javascript
Node.js 使用jade模板引擎的示例
2018/05/11 Javascript
vue2.0实现音乐/视频播放进度条组件
2018/06/06 Javascript
layui多图上传实现删除功能的例子
2019/09/23 Javascript
uploadify插件实现多个图片上传并预览
2019/09/30 Javascript
Vue中点击active并第一个默认选中功能的实现
2020/02/24 Javascript
vue实现公告栏文字上下滚动效果的示例代码
2020/06/16 Javascript
详解vue修改elementUI的分页组件视图没更新问题
2020/11/13 Javascript
[47:42]Fnatic vs Liquid 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
[01:32]寻找你心中的那团火 DOTA2 TI9火焰传递活动今日开启
2019/05/16 DOTA
详解设计模式中的工厂方法模式在Python程序中的运用
2016/03/02 Python
python3射线法判断点是否在多边形内
2019/06/28 Python
python自动循环定时开关机(非重启)测试
2019/08/26 Python
python实现XML解析的方法解析
2019/11/16 Python
python GUI库图形界面开发之PyQt5表格控件QTableView详细使用方法与实例
2020/03/01 Python
css3实例教程 一款纯css3实现的发光屏幕旋转特效
2014/12/07 HTML / CSS
澳大利亚领先的在线美容商城:Adore Beauty
2017/04/14 全球购物
ROSEFIELD手表荷兰官方网上商店:北欧极简设计女士腕表品牌
2018/01/24 全球购物
输入一行文字,找出其中大写字母、小写字母、空格、数字、及其他字符各有多少
2016/04/15 面试题
法人授权委托书格式
2014/04/08 职场文书
《每逢佳节倍思亲》教后反思
2014/04/19 职场文书
护士找工作求职信
2014/07/02 职场文书
放飞梦想演讲稿800字
2014/08/26 职场文书
紫日观后感
2015/06/05 职场文书
Python基于百度API识别并提取图片中文字
2021/06/27 Python
python+pytest接口自动化之token关联登录的实现
2022/04/06 Python
Redis 限流器
2022/05/15 Redis