Jquery操作radio,checkbox,select表单操作实现代码
一 、Select
jQuery获取Select选择的Text和Value:
1. $("#select_id").change(function(){//code...}); //为Select添加事件,当选择其中一项时触发
2. var checkText=$("#select_id").find("option:selected").text(); //获取Select选择的Text
3. var checkValue=$("#select_id").val(); //获取Select选择的Value
4. var checkIndex=$("#select_id ").get(0).selectedIndex; //获取Select选择的索引值
5. var maxIndex=$("#select_id option:last").attr("index"); //获取Select最大的索引值 jQuery设置Select选择的Text和Value:
1. $("#select_id ").get(0).selectedIndex=1; //设置Select索引值为1的项选中
2. $("#select_id ").val(4); //设置Select的Value值为4的项选中
3. $("#select_id option[text='jQuery']").attr("selected", true); //设置Select的Text值为jQuery的项选中 jQuery添加/删除Select的Option项:
1. $("#select_id").append("<option value='Value'>Text</option>"); //为Select追加一个Option(下拉项)
2. $("#select_id").prepend("<option value='0'>请选择</option>"); //为Select插入一个Option(第一个位置)
3. $("#select_id option:last").remove(); //删除Select中索引值最大Option(最后一个)
4. $("#select_id option[index='0']").remove(); //删除Select中索引值为0的Option(第一个)
5. $("#select_id option[value='3']").remove(); //删除Select中Value='3'的Option
6. $("#select_id option[text='4']").remove(); //删除Select中Text='4'的Option
7. $("#SelectID").remove(); //删除所有项 二、Checkbox
全选/取消
jQuery.attr 获取/设置对象的属性值,如:
$("input[name='chk_list']").attr("checked"); //读取所有name为'chk_list'对象的状态(是否选中)
$("input[name='chk_list']").attr("checked",true); //设置所有name为'chk_list'对象的checked为true
$("#img_1").attr("src","test.jpg"); //设置ID为img_1的<img>src的值为'test.jpg'
$("#img_1").attr("src"); //读取ID为img_1的<img>src值
下面的代码是获取上面实例中选中的checkbox的value值:
<script type="text/javascript">
var arrChk=$("input[name='chk_list'][checked]");
$(arrChk).each(function(){
window.alert(this.value);
});
});
</script> 1,获取checkbox的value
$("#checkboxID").value或$("input[type='checkbox']").eq(n).attr("checked").value
2,设置选中项
$("input[type='checkbox']").eq(1).attr("checked")//设置第一个checkbox为选中的项
3,删除所有checkbox
$("input[type='checkbox']").remove()
4,checkbox方法
$(document).ready(function() {
var check = $("input[type='checkbox']");
check.each(function(n) {
check.eq(n).bind("click", function() {
if (check.eq(n).attr("checked") != false) {
var value = check.eq(n).val();
alert(value);
}
else {
alert(check.eq(n).attr("checked"));
}
})
});
}); 三、radio
1,获取选中的value值
$("input[type='radio']:checked").val();
2,设置指定的项为当前选中项
$("input[type='radio']").eq(1).attr("checked", true);//设置第二项为选中项
$("input[type='radio'][value='值']").attr("checked, true"); 3,解决多个Radio $("input[type='radio'][@name='rdoTest2']").eq(0).attr("checked", true);
Jquery操作radio,checkbox,select表单操作实现代码的更多相关文章
- jQuery 操作 radio、select、checkbox
<script type="text/javascript"> $(function () { 一.radio 1.获取选中值,三种方法都可以: $('input:ra ...
- jquery操作radio,checkbox
1. 获取radio选中的value. $('input:radio[name=sex]:checked').val(); 2. 选择 radio 按钮 (Male). $('input:radio[ ...
- 不可错过的10个超棒jQuery表单操作代码片段
jQuery 绝对是一个伟大的开源javascript类库,是帮助我们快速和高效开发前端应用的利器.可能大家在日常的开发过程中常常会处理表单相关的 javascript,在今天这篇代码片段分享文章中, ...
- js控制表单操作的常用代码小结
收集了一些在WEB前台开发中常用的一些控制表单操作函数. 1.鼠标经过时自动选择文本鼠标划过自动选中:<input type="text" value="默认值&q ...
- jSP的3种方式实现radio ,checkBox,select的默认选择值。
jSP的3种方式实现radio ,checkBox,select的默认选择值.以radiao 为例:第一种方式:在jsp中使用java 脚本,这个方法最直接,不过脚本太多,不容易维护<%Stri ...
- 使用JQUERY操作Radio
发展中经常使用Radio为了实现用户的选择的影响.我在该项目中使用的一些JQUERY操作Radio该方法.这里分享,对于有需要的朋友参考的. 1.变化radio选择.引发一些结果 $("in ...
- 【TP3.2+onethink】radio+checkbox+select 空间 编辑页面选中,附录 js 返回上一页
1.TP3.2框架 如何实现 [radio+checkbox+select 空间 编辑页面选中],说实话,比较繁琐,不咋地!! 不废话,上代码:(其中 XX_arr 变量一维数组) <div ...
- [转]jQuery操作radio、checkbox、select 集合.
1.radio:单选框 html代码 <input type="radio" name="radio" id="radio1" val ...
- jQuery操作radio、checkbox、select 集合
1.radio:单选框 HTML代码: <input type="radio" name="radio" id="radio1" va ...
随机推荐
- BZOJ 1045: [HAOI2008] 糖果传递 数学
1045: [HAOI2008] 糖果传递 题目连接: http://www.lydsy.com/JudgeOnline/problem.php?id=1045 Description 有n个小朋友坐 ...
- C#操作注册表全攻略
相信每个人对注册表并不陌生,在运行里面输入“regedit”就可以打开注册表编辑器了.这东西对Windows系统来说可是比较重要的,也是病 毒常常会光顾的地方,比如病毒和恶意软件常常会在注册表的启动项 ...
- NGUI ERROR:UnityException: Sprite is not rectangle-packed. TextureRect is invalid.解决
在使用Ngui 3.4.9的时候,使用“Unity 2D Sprite”控件的时候,出现了UnityException: Sprite is not rectangle-packed. Texture ...
- IIS配置相关
转:让Windows Server 2008 + IIS 7+ ASP.NET 支持10万并发请求 http://www.cnblogs.com/dudu/archive/2009/11/10/160 ...
- Android Studio中导入第三方库
之前开发Android都是使用的eclipse,近期因为和外国朋友Timothy一起开发一款应用,他是从WP平台刚切换使用Android的,使用的开发环境时Android Studio,为了便于项目的 ...
- Device Pixel Ratio & Media Queries
一些重要的名词解释: CSS pixels(CSS 像素):详见http://www.w3.org/TR/css3-values/#reference-pixe CSS声明的像素值,可随着放大缩小而放 ...
- win7配置nginx+php步骤
1.下载nginx: http://www.nginx.cn/nginx-download 2.下载php : http://www.php.net/downloads.php (线程安全与非安全参 ...
- 基于HTML5实现的中国象棋游戏
棋类游戏在桌面游戏中已经非常成熟,中国象棋的版本也非常多.今天这款基于HTML5技术的中国象棋游戏非常有特色,我们不仅可以选择中国象棋的游戏难度,而且可以切换棋盘的样式.程序写累了,喝上一杯咖啡,和电 ...
- U-BOOT配置过程
摘自:<嵌入式Linux应用开发完全手册> ( Target : smdk2410 $1 Architecture: arm ...
- Java再学习——sleep(), wait(), notify(), notifyAll()
首先一点就是Thread.sleep(long millis)方法是Thread类的静态方法,其他三个wait(), notify()和notifyAll()都是Object类的方法. sleep(l ...