jQuery获取多种input值的简单实现方法


Posted in Javascript onJune 20, 2016

获取input的checked值是否为true:

第一种:

if($("input[name=item][value='val']").attr('checked')==true) //判断是否已经打勾 --注:name即控件name属性,value即控件value属性

第二种:

可以不指定属性值,因一组checkbox的value值都会保存其在数据库中对应的id,最好写成如下方式:

if($("input[name=row_checkbox]").attr('checked')==true)

第三种:

if($("[name=row_checkbox]").attr('checked')==true) --注:name即控件name属性

jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关文章分类:Web前端:

radio:

获取一组radio被选中项的值:var item = $('input[name=items][checked]').val(); --注:name即控件name属性

radio单选组的第二个元素为当前选中项 :$('input[@name=items]').get(1).checked = true;

或 $('input[name=items]').attr("checked", '1′);

radio的value = 'val'的元素为当前选中项:$('input[name=items] [value='val']').attr("checked","checked");

radio设置value=2的元素为当前选中项:$("input[type=radio]").attr("checked",'2′);

radio被选中项的value值:$("input[name='radio_name'][checked]").val();

根据Value值设置Radio为选中状态:$("input[name='radio_name'][value='要选中Radio的Value值'").attr("checked",true);

select:

获取select被选中项的文本:var item = $("select[@name=items] option[@selected]").text();

或 var item = $("select[name=items]").find("option:selected").text();

select下拉框的第二个元素为当前选中值:$('#select_id')[0].selectedIndex = 1; --注:select_id'即控件的id属性

select下拉框value = 'val'的元素为当前选中项:$("select[name=items] option[value='val']").attr("selected","selected");

select设置value=-sel3的项目为当前选中项:$("#sel").attr("value",'-sel3′); --注:sel即select控件的id属性

添加下拉框的option:$("<option value='1′>1111</option><option value='2′>2222</option>").appendTo("#sel");

select清空:$("#sel").empty();

checkbox:

checkbox的第二个元素被打勾:$("input[name=items]").get(1).checked = true; //打勾

checkbox的value='val'的元素打勾:$("input[name=item][value='val']").attr("checked",true);

或$("input[name=item][value='val']").attr("checked","checked");

判断checkbox是否已经打勾:if($("input[name=item][value='val']").attr('checked')==true)

jQuery获取CheckBox选择的Value值:

//选择被选中CheckBox元素的集合 如果你想得到Value值你需要遍历这个集合

$($("input[name='checkbox_name'][checked]")).each(function(){

arrChk+=this.value + ','; //遍历被选中CheckBox元素的集合 得到Value值

});

checkbox的checked属性:

$("#checkbox_id").attr("checked"); //获取一个CheckBox的状态(有没有被选中,返回true/false)

$("#checkbox_id").attr("checked",true); //设置一个CheckBox的状态为选中(checked=true)

$("#checkbox_id").attr("checked",false); //设置一个CheckBox的状态为不选中(checked=false)

//根据上面三条,分析分析这句代码的意思:

$("input[name='checkbox_name']").attr("checked",$("#checkbox_id").attr("checked"));

--注:根据控件checkbox_id的checked状态为name='checkbox_name'的input赋相同的checked状态

获取值:

文本框,文本区域:$("#txt").attr("value");

多选框checkbox:$("input[name='checkbox':checked]").each(function(){

var val = $(this).val();

});

单选组radio:$("input[type=radio][checked]").val();

下拉框select的value值:$('select').val();

下拉框select选中的text 值:$("select").find("option:selected").text();

文本框,文本区域:$("#txt").attr("value","); //清空内容

$("#txt").attr("value",'11′); //填充内容

事件:

当对象text_id获取焦点时触发:$("#text_id").focus(function(){//code...});

当对象text_id失去焦点时触发:$("#text_id").blur(function(){//code...});

其他:

使文本框的Vlaue值成选中状态:$("#text_id").select();

$("#text_id").val().split(","); //将Text的Value值以','分隔返回一个数组

以上这篇jQuery获取多种input值的简单实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
一个可以随意添加多个序列的tag函数
Jul 21 Javascript
JS保存、读取、换行、转Json报错处理方法
Jun 14 Javascript
解析img图片没找到onerror事件 Stack overflow at line: 0
Dec 23 Javascript
JavaScript中的Math.E属性使用详解
Jun 12 Javascript
jQuery操作cookie
Aug 08 Javascript
JavaScript中return用法示例
Nov 29 Javascript
微信小程序 scroll-view组件实现列表页实例代码
Dec 14 Javascript
将Sublime Text 3 添加到右键中的简单方法
Dec 12 Javascript
vue侧边栏动态生成下级菜单的方法
Sep 07 Javascript
小程序开发中如何使用async-await并封装公共异步请求的方法
Jan 20 Javascript
bootstrap+spring boot实现面包屑导航功能(前端代码)
Oct 09 Javascript
Node对CommonJS的模块规范
Nov 06 Javascript
jQuery图片左右滚动代码 有左右按钮实例
Jun 20 #Javascript
JavaScript操作表单实例讲解(上)
Jun 20 #Javascript
jquery 获取select数组与name数组长度的实现代码
Jun 20 #Javascript
JavaScript提升性能的常用技巧总结【经典】
Jun 20 #Javascript
使用jQuery给input标签设置默认值
Jun 20 #Javascript
js中获取时间new Date()的全面介绍
Jun 20 #Javascript
AngularJs Javascript MVC 框架
Jun 20 #Javascript
You might like
图片存储与浏览一例(Linux+Apache+PHP+MySQL)
2006/10/09 PHP
PHP文件操作实现代码分享
2011/09/01 PHP
PHP中基本HTTP认证技巧分析
2015/03/16 PHP
thinkPHP基于ajax实现的菜单与分页示例
2016/07/12 PHP
PHP const定义常量及global定义全局常量实例解析
2020/05/28 PHP
javascript调试说明
2010/06/07 Javascript
Javascript中正则表达式的全局匹配模式分析
2011/04/26 Javascript
给artDialog 5.02 增加ajax get功能详细介绍
2012/11/13 Javascript
js 阻止子元素响应父元素的onmouseout事件具体实现
2013/12/23 Javascript
jquery调取json数据实现省市级联的方法
2015/01/29 Javascript
一波JavaScript日期判断脚本分享
2016/03/06 Javascript
详解Vue2 SSR 缓存 Api 数据
2017/11/20 Javascript
浅谈Vue 数据响应式原理
2018/05/07 Javascript
Vue2.0+Vux搭建一个完整的移动webApp项目的示例
2019/03/19 Javascript
vue cli 3.x 项目部署到 github pages的方法
2019/04/17 Javascript
JS轮播图的实现方法
2020/08/24 Javascript
vue集成openlayers加载geojson并实现点击弹窗教程
2020/09/24 Javascript
[03:24]DOTA2超级联赛专访hao 大翻盘就是逆袭
2013/05/24 DOTA
用Python编程实现语音控制电脑
2014/04/01 Python
python进阶教程之文本文件的读取和写入
2014/08/29 Python
Python的Django框架中的select_related函数对QuerySet 查询的优化
2015/04/01 Python
Python变量和字符串详解
2017/04/29 Python
Python编程实现两个文件夹里文件的对比功能示例【包含内容的对比】
2017/06/20 Python
Django 多表关联 存储 使用方法详解 ManyToManyField save
2019/08/09 Python
基于python的BP神经网络及异或实现过程解析
2019/09/30 Python
python tkinter控件布局项目实例
2019/11/04 Python
Django 创建后台,配置sqlite3教程
2019/11/18 Python
英国人最爱的饰品网站:Accessorize
2016/08/22 全球购物
泰国排名第一的家居用品中心:HomePro
2020/11/18 全球购物
教师实习自我鉴定
2013/12/13 职场文书
蔬菜基地的创业计划书
2014/01/06 职场文书
运动会解说词200字
2014/02/06 职场文书
工程售后服务方案
2014/06/08 职场文书
2019入党申请书范文3篇
2019/08/21 职场文书
Nginx快速入门教程
2021/03/31 Servers
从零开始在Centos7上部署SpringBoot项目
2022/04/07 Servers