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 相关文章推荐
js获取当前页面的url网址信息
Jun 12 Javascript
JavaScript利用正则表达式去除日期中的“-”
Jul 01 Javascript
jQuery大于号(&gt;)选择器的作用解释
Jan 13 Javascript
angularjs表格分页功能详解
Jan 21 Javascript
无法获取隐藏元素宽度和高度的解决方案
Mar 07 Javascript
vue 怎么创建组件及组件使用方法
Jul 27 Javascript
jQuery实现全选、反选和不选功能
Aug 16 jQuery
React Native预设占位placeholder的使用
Sep 28 Javascript
Django+vue跨域问题解决的详细步骤
Jan 20 Javascript
ES6数组与对象的解构赋值详解
Jun 14 Javascript
vue中keep-alive、activated的探讨和使用详解
Jul 26 Javascript
浏览器JavaScript调试功能无法使用解决方案
Sep 18 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
PHP 输出URL的快捷方式示例代码
2013/09/22 PHP
thinkphp中html:list标签传递多个参数实例
2014/10/30 PHP
Yii2中简单的场景使用介绍
2017/06/02 PHP
PHP中使用mpdf 导出PDF文件的实现方法
2018/10/22 PHP
利用javascript中的call实现继承
2007/01/22 Javascript
JS网络游戏-(模拟城市webgame)提供的一些例子下载
2007/10/14 Javascript
仿迅雷焦点广告效果(JQuery版)
2008/11/19 Javascript
网页和浏览器兼容性问题汇总(draft1)
2009/06/01 Javascript
Jquery优化效率 提升性能解决方案
2010/09/06 Javascript
treepanel动态加载数据实现代码
2012/12/15 Javascript
重构Javascript代码示例(重构前后对比)
2013/01/23 Javascript
javascript获取函数名称、函数参数、对象属性名称的代码实例
2014/04/12 Javascript
js获取 type=radio 值的方法
2014/05/09 Javascript
详解Bootstrap插件
2016/04/25 Javascript
js replace(a,b)之替换字符串中所有指定字符的方法
2016/08/17 Javascript
基于JavaScript Array数组方法(新手必看篇)
2016/08/20 Javascript
AngularJS入门教程之路由机制ngRoute实例分析
2016/12/13 Javascript
vue使用el-upload上传文件及Feign服务间传递文件的方法
2019/03/15 Javascript
小程序云开发教程如何使用云函数实现点赞功能
2019/05/18 Javascript
vuex实现像调用模板方法一样调用Mutations方法
2019/11/06 Javascript
vue使用swiper实现中间大两边小的轮播图效果
2019/11/24 Javascript
vue实现表格合并功能
2020/12/01 Vue.js
[06:10]6.81新信使新套装!给你一个炫酷的DOTA2
2014/05/06 DOTA
[05:31]DOTA2英雄梦之声_第08期_莉娜
2014/06/23 DOTA
[01:27:44]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Aster BO3 第一场 1月24日
2021/03/11 DOTA
Python中转换角度为弧度的radians()方法
2015/05/18 Python
python清除字符串里非字母字符的方法
2015/07/02 Python
如何使用python操作vmware
2019/07/27 Python
Pytorch中Tensor与各种图像格式的相互转化详解
2019/12/26 Python
TensorFLow 变量命名空间实例
2020/02/11 Python
python飞机大战游戏实例讲解
2020/12/04 Python
学校四风问题对照检查材料思想汇报
2014/09/26 职场文书
本溪水洞导游词
2015/02/11 职场文书
朝花夕拾读书笔记
2015/06/29 职场文书
2019年销售部季度工作计划3篇
2019/10/09 职场文书
python的变量和简单数字类型详解
2021/09/15 Python