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的extend和fn.extend的使用说明
Jan 09 Javascript
js arguments对象应用介绍
Nov 28 Javascript
继续学习javascript闭包
Dec 03 Javascript
基于canvas实现的绚丽圆圈效果完整实例
Jan 26 Javascript
jQuery新窗口打开外链接
Jul 21 Javascript
jQuery实现的表格展开伸缩效果实例
Sep 07 Javascript
jQuery插件FusionCharts实现的Marimekko图效果示例【附demo源码】
Mar 24 jQuery
利用纯JS实现像素逐渐显示的方法示例
Aug 14 Javascript
vue结合Echarts实现点击高亮效果的示例
Mar 17 Javascript
vue-cli在 history模式下的配置详解
Nov 26 Javascript
微信小程序点击生成朋友圈分享图(遇到的坑)
Jun 17 Javascript
js实现随机圆与矩形功能
Oct 29 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实现用户认证及管理完全源码
2007/03/11 PHP
解析PHP中的正则表达式以及模式匹配
2013/06/19 PHP
php获取目录中所有文件名及判断文件与目录的简单方法
2017/03/04 PHP
解决laravel(5.5)访问public报错的问题
2019/10/12 PHP
JavaScipt基本教程之前言
2008/01/16 Javascript
require.js深入了解 require.js特性介绍
2014/09/04 Javascript
jquery实现html页面 div 假分页有原理有代码
2014/09/06 Javascript
Javascript学习笔记之数组的构造函数
2014/11/23 Javascript
JS实现动态移动层及拖动浮层关闭的方法
2015/04/30 Javascript
jquery实现转盘抽奖功能
2017/01/06 Javascript
bootstrap 模态框(modal)实现水平垂直居中显示
2017/01/23 Javascript
JavaScript实现分页效果
2017/03/28 Javascript
基于JavaScript实现选项卡效果
2017/07/21 Javascript
详解使用nvm管理多版本node的方法
2017/08/30 Javascript
基于vue 实现token验证的实例代码
2017/12/14 Javascript
在 vue-cli v3.0 中使用 SCSS/SASS的方法
2018/06/14 Javascript
vue实现的仿淘宝购物车功能详解
2019/01/27 Javascript
JS Math对象与Math方法实例小结
2019/07/05 Javascript
vuejs移动端实现div拖拽移动
2019/07/25 Javascript
vue-cli3单页构建大型项目方案
2020/04/07 Javascript
es6函数之尾递归用法实例分析
2020/04/25 Javascript
React服务端渲染原理解析与实践
2021/03/04 Javascript
Python2.x利用commands模块执行Linux shell命令
2016/03/11 Python
浅谈pytorch和Numpy的区别以及相互转换方法
2018/07/26 Python
python3.5基于TCP实现文件传输
2020/03/20 Python
django实现模型字段动态choice的操作
2020/04/01 Python
AmazeUI 评论列表的实现示例
2020/08/13 HTML / CSS
韩国11街:11STREET
2018/03/27 全球购物
Black Halo官方网站:购买连衣裙、礼服和连体裤
2018/06/13 全球购物
关于赌博的检讨书
2014/01/08 职场文书
出生医学证明样本
2014/01/17 职场文书
酒店中秋节活动方案
2014/01/31 职场文书
弘扬职业精神演讲稿
2014/03/20 职场文书
推广普通话标语
2014/06/27 职场文书
入党转正申请自我鉴定
2019/06/25 职场文书
python本地文件服务器实例教程
2021/05/02 Python