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 相关文章推荐
event对象的方法 兼容多浏览器
Jun 27 Javascript
capacityFixed 基于jquery的类似于新浪微博新消息提示的定位框
May 24 Javascript
jquery复选框全选/取消示例
Dec 30 Javascript
jquery使用slideDown实现模块缓慢拉出效果的方法
Mar 27 Javascript
JS实现很实用的对联广告代码(可自适应高度)
Sep 18 Javascript
13个PHP函数超实用
Oct 21 Javascript
jquery判断input值不为空的方法
Jun 05 Javascript
AngularJS equal比较对象实例详解
Sep 14 Javascript
JavaScript实现通过select标签跳转网页的方法
Sep 29 Javascript
Vuejs仿网易云音乐实现听歌及搜索功能
Mar 30 Javascript
学习使用ExpressJS 4.0中的新Router的用法
Nov 06 Javascript
layer iframe 设置关闭按钮的方法
Sep 12 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判断搜索引擎蜘蛛并自动记忆到文件的代码
2012/02/04 PHP
PHP实现图片压缩的两则实例
2014/07/19 PHP
Yii实现复选框批量操作实例代码
2017/03/15 PHP
PHP数据分析引擎计算余弦相似度算法示例
2017/08/08 PHP
laravel5.4利用163邮箱发送邮件的步骤详解
2017/09/22 PHP
Use Word to Search for Files
2007/06/15 Javascript
ToolTips JQEURY插件之简洁小提示框效果
2011/11/19 Javascript
微信小程序-小说阅读小程序实例(demo)
2017/01/12 Javascript
微信小程序通过api接口将json数据展现到小程序示例
2017/01/20 Javascript
JQueryEasyUI框架下的combobox的取值和绑定的方法
2017/01/22 Javascript
JS实现的数字格式化功能示例
2017/02/10 Javascript
EasyUI创建人员树的实例代码
2017/09/15 Javascript
详解如何使用webpack打包多页jquery项目
2019/02/01 jQuery
el-select数据过多懒加载的解决(loadmore)
2019/05/29 Javascript
Antd-vue Table组件添加Click事件,实现点击某行数据教程
2020/11/17 Javascript
[01:36:57]【09DOTA2第一视角】小骷髅
2014/04/16 DOTA
[46:27]DOTA2上海特级锦标赛主赛事日 - 1 胜者组第一轮#2LGD VS MVP.Phx第一局
2016/03/02 DOTA
使用apidoc管理RESTful风格Flask项目接口文档方法
2018/02/07 Python
Python 使用PyQt5 完成选择文件或目录的对话框方法
2019/06/27 Python
python主线程与子线程的结束顺序实例解析
2019/12/17 Python
使用python求解二次规划的问题
2020/02/29 Python
3种适用于Python的疯狂秘密武器及原因解析
2020/04/29 Python
html5 桌面提醒:Notifycations应用介绍
2012/11/27 HTML / CSS
HTML5 Canvas中绘制矩形实例
2015/01/01 HTML / CSS
购买澳大利亚最好的服装和内衣在线:BONDS
2016/10/14 全球购物
英国大码女性时装零售商:Evans
2018/08/29 全球购物
AssertionError 跟一下那个类是 “is – a”的关系
2012/02/21 面试题
小学毕业家长寄语
2014/01/19 职场文书
代理商会议邀请函
2014/01/27 职场文书
物业总经理助理岗位职责
2014/06/29 职场文书
机关作风整顿个人剖析材料
2014/10/06 职场文书
教师党员批评与自我批评发言稿
2014/10/15 职场文书
2015中秋祝酒词
2015/08/12 职场文书
Mac环境Nginx配置和访问本地静态资源的实现
2021/03/31 Servers
Spring Boot 底层原理基础深度解析
2022/04/03 Java/Android
Python中itertools库的四个函数介绍
2022/04/06 Python