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全选功能
Nov 07 Javascript
javascript中文本框中输入法切换的问题
Dec 10 Javascript
JavaScript定义类和对象的方法
Nov 26 Javascript
JS表的模拟方法
Feb 05 Javascript
JS中完美兼容各大浏览器的scrolltop方法
Apr 17 Javascript
jQuery+ajax+asp.net获取Json值的方法
Jun 08 Javascript
url传递的参数值中包含&amp;时,url自动截断问题的解决方法
Aug 02 Javascript
详解使用vue脚手架工具搭建vue-webpack项目
May 10 Javascript
vue input实现点击按钮文字增删功能示例
Jan 29 Javascript
vue实现百度搜索功能
Dec 28 Javascript
vue3.0实现插件封装
Dec 14 Vue.js
vue 实现基础组件的自动化全局注册
Dec 25 Vue.js
编写高性能的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
PHPExcel读取Excel文件的实现代码
2011/12/06 PHP
浏览器关闭后,能继续执行的php函数(ignore_user_abort)
2012/08/01 PHP
PHP中使用socket方式GET、POST数据实例
2015/04/02 PHP
php实现根据IP地址获取其所在省市的方法
2015/04/30 PHP
php防止CC攻击代码 php防止网页频繁刷新
2015/12/21 PHP
PHP在线调试执行的实现方法(附demo源码)
2016/04/28 PHP
Laravel模型事件的实现原理详解
2018/03/14 PHP
js window.event对象详尽解析
2009/02/17 Javascript
jQuery autocomplate 自扩展插件、自动完成示例代码
2011/03/28 Javascript
设为首页和收藏的Javascript代码(亲测兼容IE,Firefox,chrome等浏览器)
2013/11/18 Javascript
js实现ifram取父窗口URL地址的方法
2015/02/09 Javascript
JavaScript数组前面插入元素的方法
2015/04/06 Javascript
jQuery绑定事件的四种方式介绍
2016/10/31 Javascript
bootstrap与pagehelper实现分页效果
2018/12/29 Javascript
jQuery插件实现非常实用的tab栏切换功能【案例】
2019/02/18 jQuery
node.js中express模块创建服务器和http模块客户端发请求
2019/03/06 Javascript
vue调用语音播放的方法
2019/09/27 Javascript
vue使用@scroll监听滚动事件时,@scroll无效问题的解决方法详解
2019/10/15 Javascript
vue动态路由:路由参数改变,视图不更新问题的解决
2019/11/05 Javascript
vue制作toast组件npm包示例代码
2020/10/29 Javascript
[01:13:51]TNC vs Serenity 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
详解Python的循环结构知识点
2019/05/20 Python
python多线程共享变量的使用和效率方法
2019/07/16 Python
django 配置阿里云OSS存储media文件的例子
2019/08/20 Python
Python+OpenCV实现旋转文本校正方式
2020/01/09 Python
python 计算方位角实例(根据两点的坐标计算)
2020/01/17 Python
联想澳大利亚官网:Lenovo Australia
2018/01/18 全球购物
Baracuta官方网站:Harrington夹克,G9,G4,G10等
2018/03/06 全球购物
音乐学院硕士生的自我评价分享
2013/11/01 职场文书
运动会领导邀请函
2014/01/10 职场文书
贷款担保申请书
2014/05/20 职场文书
法学院毕业生求职信
2014/06/25 职场文书
学生穿着不得体检讨书
2014/10/12 职场文书
MySQL读取JSON转换的方式
2022/03/18 MySQL
漫画「古见同学有交流障碍症」第25卷封面公开
2022/03/21 日漫
Go 中的空白标识符下划线
2022/03/25 Golang