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 相关文章推荐
jQuery.prototype.init选择器构造函数源码思路分析
Feb 05 Javascript
node.js中的querystring.parse方法使用说明
Dec 10 Javascript
jQuery实现根据类型自动显示和隐藏表单
Mar 18 Javascript
JS实现的在线调色板实例(附demo源码下载)
Mar 01 Javascript
jQuery使用Layer弹出层插件闪退问题
Dec 22 Javascript
JS实现复制内容到剪贴板功能
Feb 05 Javascript
JS简单判断字符在另一个字符串中出现次数的2种常用方法
Apr 20 Javascript
基于canvas粒子系统的构建详解
Aug 31 Javascript
jQuery Migrate 插件用法实例详解
May 22 jQuery
vue-cli3项目展示本地Markdown文件的方法
Jun 07 Javascript
JavaScript异步操作的几种常见处理方法实例总结
May 11 Javascript
在vue-cli创建的项目中使用sass操作
Aug 10 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和ACCESS写聊天室(七)
2006/10/09 PHP
PHP 关于访问控制的和运算符优先级介绍
2013/07/08 PHP
smarty模板中拼接字符串的方法
2014/02/14 PHP
PHP中explode函数和split函数的区别小结
2016/08/24 PHP
PHP5.6.8连接SQL Server 2008 R2数据库常用技巧分析总结
2019/05/06 PHP
laravel 解决paginate查询多个字段报错的问题
2019/10/22 PHP
JS target与currentTarget区别说明
2011/08/28 Javascript
js中的caller和callee属性介绍和例子
2014/06/07 Javascript
详解JS函数重载
2014/12/04 Javascript
《JavaScript DOM 编程艺术》读书笔记之JavaScript 图片库
2015/01/09 Javascript
JavaScript实现复制文章自动添加版权
2016/08/02 Javascript
bootstrap table之通用方法( 时间控件,导出,动态下拉框, 表单验证 ,选中与获取信息)代码分享
2017/01/24 Javascript
微信小程序 定位到当前城市实现实例代码
2017/02/23 Javascript
Bootstrap表单控件学习使用
2017/03/07 Javascript
Easy UI动态树点击文字实现展开关闭功能
2017/09/30 Javascript
react native 文字轮播的实现示例
2018/07/27 Javascript
详解webpack 热更新优化
2018/09/13 Javascript
Vue.js如何使用Socket.IO的示例代码
2019/09/05 Javascript
Vue.js组件props数据验证实现详解
2019/10/19 Javascript
[00:12]DAC SOLO赛卫冕冠军 VG.Paparazi灬展现SOLO技巧
2018/04/06 DOTA
[46:03]LGD vs VGJ.T 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
Python模块学习 datetime介绍
2012/08/27 Python
python对excel文档去重及求和的实例
2018/04/18 Python
python issubclass 和 isinstance函数
2019/07/25 Python
Django中的session用法详解
2020/03/09 Python
Manjaro、pip、conda更换国内源的方法
2020/11/17 Python
CSS3实现滚动条动画效果代码分享
2016/08/03 HTML / CSS
新加坡最受追捧的体验平台:Hapz
2018/01/01 全球购物
中学教师岗位职责
2013/11/26 职场文书
《学会待客》教学反思
2014/02/22 职场文书
优秀员工获奖感言
2014/03/01 职场文书
厕所文明标语
2014/06/11 职场文书
党支部创先争优活动总结
2014/08/28 职场文书
庆祝新中国成立65周年“向国旗敬礼”网上签名寄语
2014/09/27 职场文书
检讨书大全
2015/01/27 职场文书
将图片保存到mysql数据库并展示在前端页面的实现代码
2021/05/02 MySQL