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 相关文章推荐
汉化英文版的Dreamweaver CS5并自动提示jquery
Nov 25 Javascript
如何用ajax来创建一个XMLHttpRequest对象
Dec 10 Javascript
js自动查找select下拉的菜单并选择(示例代码)
Feb 26 Javascript
DOM操作一些常用的属性汇总
Mar 13 Javascript
Bootstrap源码学习笔记之bootstrap进度条
Dec 24 Javascript
JS实现的简单表单验证功能示例
Oct 13 Javascript
浅谈PDF.js使用心得
Jun 07 Javascript
jquery获取select选中值的文本,并赋值给另一个输入框的方法
Aug 21 jQuery
详解vue-cli3 中跨域解决方案
Apr 10 Javascript
layui按条件隐藏表格列的实例
Sep 19 Javascript
JavaScript鼠标悬停事件用法解析
May 15 Javascript
Bootstrap告警框(alert)实现弹出效果和短暂显示后上浮消失的示例代码
Aug 27 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中使用Imagick实现各种图片效果实例
2015/01/21 PHP
PHP查看SSL证书信息的方法
2016/09/22 PHP
Javascript的IE和Firefox兼容性汇编(zz)
2007/02/02 Javascript
比较不错的JS/JQuery显示或隐藏文本的方法
2014/02/13 Javascript
jQuery 文本框得失焦点的简单实例
2014/02/19 Javascript
jquery序列化方法实例分析
2015/06/10 Javascript
H5移动端适配 Flexible方案
2016/10/24 Javascript
利用JQuery直接调用asp.net后台的简单方法
2016/10/27 Javascript
bootstrap按钮插件(Button)使用方法解析
2017/01/13 Javascript
vue.js实现单选框、复选框和下拉框示例
2017/07/18 Javascript
jQuery进阶实践之利用最优雅的方式如何写ajax请求
2017/12/20 jQuery
谈谈Python进行验证码识别的一些想法
2016/01/25 Python
Python将多个excel表格合并为一个表格
2021/02/22 Python
Python读取Pickle文件信息并计算与当前时间间隔的方法分析
2019/01/30 Python
零基础使用Python读写处理Excel表格的方法
2019/05/02 Python
python的turtle库使用详解
2019/05/10 Python
numpy.random.shuffle打乱顺序函数的实现
2019/09/10 Python
Python编程快速上手——强口令检测算法案例分析
2020/02/29 Python
解决jupyter运行pyqt代码内核重启的问题
2020/04/16 Python
python开发前景如何
2020/06/11 Python
django Model层常用验证器及自定义验证器详解
2020/07/15 Python
用于ETL的Python数据转换工具详解
2020/07/21 Python
css3实现信纸/同学录效果的示例代码
2018/12/11 HTML / CSS
奥地利智能家居和智能生活网上商店:tink.at
2019/10/07 全球购物
定义一结构体变量,用其表示点坐标,并输入两点坐标,求两点之间的距离
2015/08/17 面试题
工程专业求职自荐书范文
2014/02/18 职场文书
新品发布会主持词
2014/04/02 职场文书
消防安全承诺书
2014/05/22 职场文书
教室布置标语
2014/06/26 职场文书
艺术设计专业毕业生推荐信
2014/07/08 职场文书
2015大学生实训报告
2014/11/05 职场文书
房地产销售员岗位职责
2015/04/11 职场文书
无工作证明怎么写
2015/06/15 职场文书
新学期开学标语2015
2015/07/16 职场文书
2015年重阳节活动主持词
2015/07/30 职场文书
病假条格式范文
2015/08/17 职场文书