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 相关文章推荐
JS限制上传图片大小不使用控件在本地实现
Dec 19 Javascript
jquery转盘抽奖功能实现
Nov 13 Javascript
谈谈AngularJs中的隐藏和显示
Dec 09 Javascript
jquery实现表格中点击相应行变色功能效果【实例代码】
May 09 Javascript
jQuery ajax中使用confirm,确认是否删除的简单实例
Jun 17 Javascript
js放到head中失效的原因与解决方法
Mar 07 Javascript
jQuery+Ajax实现用户名重名实时检测
Jun 01 jQuery
简易Vue评论框架的实现(父组件的实现)
Jan 08 Javascript
微信小程序实现登录遮罩效果
Nov 01 Javascript
webpack4手动搭建Vue开发环境实现todoList项目的方法
May 16 Javascript
vue实现在进行增删改操作后刷新页面
Aug 05 Javascript
vue实现井字棋游戏
Sep 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和ACCESS写聊天室(九)
2006/10/09 PHP
PHP添加MySQL数据记录代码
2008/06/07 PHP
PHP n个不重复的随机数生成代码
2009/06/23 PHP
PHP实现冒泡排序的简单实例
2016/05/26 PHP
Yii 2.0实现联表查询加搜索分页的方法示例
2017/08/02 PHP
PHP Socket网络操作类定义与用法示例
2017/08/30 PHP
js验证是否为数字的总结
2013/04/14 Javascript
使用原生js实现页面蒙灰(mask)效果示例代码
2014/06/20 Javascript
解决js图片加载时出现404的问题
2020/11/30 Javascript
完善的jquery处理机制
2016/02/21 Javascript
JS动态给对象添加事件的简单方法
2016/07/19 Javascript
JavaScript重定向URL参数的两种方法小结
2016/10/19 Javascript
Javascript 跨域知识详细介绍
2016/10/30 Javascript
JS实现密码框的显示密码和隐藏密码功能示例
2016/12/26 Javascript
vue.js使用v-pre与v-html输出HTML操作示例
2018/07/07 Javascript
不得不知的ES6小技巧
2018/07/28 Javascript
webpack4.x CommonJS模块化浅析
2018/11/09 Javascript
vue 项目@change多个参数传值多个事件的操作
2021/01/29 Vue.js
JavaScript实现筛选数组
2021/03/02 Javascript
[01:18:43]2014 DOTA2华西杯精英邀请赛5 24 iG VS DK
2014/05/25 DOTA
python实现的多线程端口扫描功能示例
2017/01/21 Python
python中os和sys模块的区别与常用方法总结
2017/11/14 Python
神经网络python源码分享
2017/12/15 Python
python smtplib模块自动收发邮件功能(二)
2018/05/22 Python
Django网络框架之HelloDjango项目创建教程
2019/06/06 Python
python读取文件指定行内容实例讲解
2020/03/02 Python
Python如何读写二进制数组数据
2020/08/01 Python
Python的轻量级ORM框架peewee使用教程
2021/02/05 Python
html5 video全屏播放/自动播放的实现示例
2020/08/06 HTML / CSS
Pretty You London官网:英国拖鞋和睡衣品牌
2019/05/08 全球购物
土耳其新趋势女装购物网站:Addax
2020/01/07 全球购物
淘宝客服自我总结鉴定
2014/01/25 职场文书
党的群众路线查摆剖析材料
2014/10/10 职场文书
企业安全隐患排查治理制度
2015/08/05 职场文书
2016年中学清明节活动总结
2016/04/01 职场文书
浅谈克隆 JavaScript
2021/11/02 Javascript