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 相关文章推荐
Google Map Api和GOOGLE Search Api整合实现代码
Jul 18 Javascript
jquery 学习之二 属性相关
Nov 23 Javascript
深入理解JavaScript系列(6):S.O.L.I.D五大原则之单一职责SRP
Jan 15 Javascript
ExtJS的拖拽效果示例
Dec 09 Javascript
javascript使用call调用微信API
Dec 15 Javascript
JS+CSS实现大气的黑色首页导航菜单效果代码
Sep 10 Javascript
jQuery实现瀑布流布局详解(PC和移动端)
Sep 01 Javascript
JavaScript判断数组重复内容的两种方法(推荐)
Jun 06 Javascript
Java框架SSH结合Easyui控件实现省市县三级联动示例解析
Jun 12 Javascript
vue实现ajax滚动下拉加载,同时具有loading效果(推荐)
Jan 11 Javascript
完美解决linux下node.js全局模块找不到的情况
May 16 Javascript
Vue2.0+Vux搭建一个完整的移动webApp项目的示例
Mar 19 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获取图片RGB颜色值
2014/07/28 PHP
PHP产生不重复随机数的5个方法总结
2014/11/12 PHP
php实现的用户查询类实例
2015/06/18 PHP
javascript一些不错的函数脚本代码
2008/09/10 Javascript
&amp;lt;script defer&amp;gt; defer 是什么意思
2009/05/10 Javascript
JavaScript判断窗口是否最小化的代码(跨浏览器)
2010/08/01 Javascript
JQuery扩展插件Validate—6 radio、checkbox、select的验证
2011/09/05 Javascript
js控制web打印(局部打印)方法整理
2013/05/29 Javascript
20行代码实现的一个CSS覆盖率测试脚本
2013/07/07 Javascript
JQuery获取或设置ckeditor的数据(示例代码)
2013/11/15 Javascript
5种处理js跨域问题方法汇总
2014/12/04 Javascript
一张Web前端的思维导图分享
2015/07/03 Javascript
解决jQuery ajax请求在IE6中莫名中断的问题
2016/06/20 Javascript
JS 实现Base64编码与解码实例详解
2016/11/07 Javascript
jquery实现多次上传同一张图片
2017/01/09 Javascript
VUE实现一个分页组件的示例
2017/09/13 Javascript
Vue利用canvas实现移动端手写板的方法
2018/05/03 Javascript
js判断复选框是否选中的方法示例【基于jQuery】
2019/10/10 jQuery
JS 设计模式之:单例模式定义与实现方法浅析
2020/05/06 Javascript
Python编程使用*解包和itertools.product()求笛卡尔积的方法
2017/12/18 Python
基于Python中求和函数sum的用法详解
2018/06/28 Python
Django 实现admin后台显示图片缩略图的例子
2019/07/28 Python
python实现银行管理系统
2019/10/25 Python
Python编程快速上手——疯狂填词程序实现方法分析
2020/02/29 Python
django日志默认打印request请求信息的方法示例
2020/05/17 Python
Appium+Python实现简单的自动化登录测试的实现
2021/01/26 Python
html5表单及新增的改良元素详解
2016/06/07 HTML / CSS
卡骆驰德国官方网站:Crocs德国
2019/03/29 全球购物
广告设计专业自荐信范文
2013/11/14 职场文书
房屋租赁意向书
2014/04/01 职场文书
安全资料员岗位职责范本
2014/06/28 职场文书
2014年药店店长工作总结
2014/11/17 职场文书
上班迟到检讨书范文
2015/05/06 职场文书
小学英语听课心得体会
2016/01/14 职场文书
《折线统计图》教学反思
2016/02/22 职场文书
德劲DE1108畅想
2021/04/22 无线电