JQuery中_Radio、DropDownList、Checkbox选择控件的处理
Radio 
1.获取选中值,三种方法都可以:
$('input:radio:checked').val();
$("input[type='radio']:checked").val();
$("input[name='rd']:checked").val();
2.设置第一个Radio为选中值:
$('input:radio:first').attr('checked', 'checked'); 或者
$('input:radio:first').attr('checked', 'true'); 注: attr("checked",'checked')= attr("checked", 'true')= attr("checked", true)
3.设置最后一个Radio为选中值: $('input:radio:last').attr('checked', 'checked');
或者 $('input:radio:last').attr('checked', 'true');
4.根据索引值设置任意一个radio为选中值:
$('input:radio').eq(索引值).attr('checked', 'true');索引值=0,1,2.... 或者 $('input:radio').slice(1,2).attr('checked', 'true');
5.根据Value值设置Radio为选中值
$("input:radio[value='rd2']").attr('checked','true'); 或者
$("input[value='rd2']").attr('checked','true');
6.删除Value值为rd2的Radio
$("input:radio[value='rd2']").remove();
7.删除第几个Radio
$("input:radio").eq(索引值).remove();索引值=0,1,2....
如删除第3个Radio:$("input:radio").eq(2).remove();
8.遍历Radio
$('input:radio').each(function(index,domEle){ //写入代码 });
DropDownList 
1. 获取选中项: 获取选中项的Value值: $('select#sel option:selected').val(); 或者
$('select#sel').find('option:selected').val(); 获取选中项的Text值:
$('select#seloption:selected').text(); 或者
$('select#sel').find('option:selected').text();
2. 获取当前选中项的索引值:
$('select#sel').get(0).selectedIndex;
3. 获取当前option的最大索引值:
$('select#sel option:last').attr("index")
4. 获取DropdownList的长度:
$('select#sel')[0].options.length; 或者
$('select#sel').get(0).options.length;
5. 设置第一个option为选中值:
$('select#sel option:first').attr('selected','true') 或者
$('select#sel')[0].selectedIndex = 0;
6. 设置最后一个option为选中值:
$('select#sel option:last).attr('selected','true')
7. 根据索引值设置任意一个option为选中值: $('select#sel')[0].selectedIndex =索引值;索引值=0,1,2....
8. 设置Value=4 的option为选中值: $('select#sel').attr('value','4'); 或者
$("select#sel option[value='4']").attr('selected', 'true');
9. 删除Value=3的option: $("select#sel option[value='3']").remove();
10.删除第几个option: $(" select#sel option ").eq(索引值).remove();索引值=0,1,2....
如删除第3个Radio: $(" select#sel option ").eq(2).remove();
11.删除第一个option: $(" select#sel option ").eq(0).remove(); 或者
$("select#sel option:first").remove();
12. 删除最后一个option:
$("select#sel option:last").remove();
13. 删除dropdownlist:
$("select#sel").remove();
14.在select后面添加一个option:
$("select#sel").append("<option value='6'>f</option>");
15. 在select前面添加一个option: $("select#sel").prepend("<option value='0'>0</option>");
16. 遍历option: $(' select#sel option ').each(function (index, domEle) { //写入代码 }); CheckBox
1. 获取单个checkbox选中项(三种写法):
$("input:checkbox:checked").val() 或者
$("input:[type='checkbox']:checked").val(); 或者
$("input:[name='ck']:checked").val();
2. 获取多个checkbox选中项:
$('input:checkbox').each(function() { if ($(this).attr('checked') ==true) { alert($(this).val()); } });
3. 设置第一个checkbox 为选中值:
$('input:checkbox:first').attr("checked",'checked'); 或者
$('input:checkbox').eq(0).attr("checked",'true');
4. 设置最后一个checkbox为选中值:
$('input:radio:last').attr('checked', 'checked'); 或者
$('input:radio:last').attr('checked', 'true');
5. 根据索引值设置任意一个checkbox为选中值: $('input:checkbox).eq(索引值).attr('checked', 'true');索引值=0,1,2.... 或者 $('input:radio').slice(1,2).attr('checked', 'true');
6. 选中多个checkbox: 同时选中第1个和第2个的checkbox:
$('input:radio').slice(0,2).attr('checked','true');
7. 根据Value值设置checkbox为选中值:
$("input:checkbox[value='1']").attr('checked','true');
8. 删除Value=1的checkbox: $("input:checkbox[value='1']").remove();
9. 删除第几个checkbox: $("input:checkbox").eq(索引值).remove();索引值=0,1,2....
如删除第3个checkbox: $("input:checkbox").eq(2).remove();
10.遍历checkbox:
$('input:checkbox').each(function (index, domEle) { //写入代码 });
11.全部选中 $('input:checkbox').each(function() {
$(this).attr('checked', true); });
12.全部取消选择:
$('input:checkbox').each(function () { $(this).attr('checked',false); });
===========================以下代码和上面大多是重复的=============================
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
jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关
获取一组radio被选中项的值 var item = $('input[@name=items][@checked]').val();
获取select被选中项的文本 var item = $("select[@name=items] option[@selected]").text();
select下拉框的第二个元素为当前选中值
$('#select_id')[0].selectedIndex = 1;
$("#select_id'").attr("value", '12'); //设置value=12的项目为当前选中项
$("select#select_id option:last").attr('selected', true); //设置下拉列表中的最后一个值为当前选中
radio单选组的第二个元素为当前选中值
$('input[@name=items]').get(1).checked = true;
获取值:
文本框,文本区域:$("#txt").attr("value");
多选框checkbox:$("#checkbox_id").attr("value");
单选组radio: $("input[@type=radio][@checked]").val();
下拉框select: $('#sel').val();
控制表单元素:
文本框,文本区域:$("#txt").attr("value",'');//清空内容
$("#txt").attr("value",'11');//填充内容
多选框checkbox: $("#chk1").attr("checked",'');//不打勾
$("#chk2").attr("checked",true);//打勾
if($("#chk1").attr('checked')==undefined) //判断是否已经打勾
单选组radio: $("input[@type=radio]").attr("checked",'2');//设置value=2的项目为当前选中项
下拉框select: $("#sel").attr("value",'-sel3');//设置value=-sel3的项目为当前选中项
$("<option value='1'>1111</option><option value='2'>2222</option>").appendTo("#sel")//添加下拉框的option
$("#sel").empty();//清空下拉框
-------------------------------------------------------------------
//遍历option和添加、移除
option function changeShipMethod(shipping){
var len = $("select[@name=ISHIPTYPE] option").length
if(shipping.value != "CA"){
$("select[@name=ISHIPTYPE] option").each(function(){
if($(this).val() == 111){
$(this).remove();
} });
}else{
$("<option value='111'>UPS Ground</option>").appendTo($("select[@name=ISHIPTYPE]"));
}
}
//取得下拉選單的選取值
$(#testSelect option:selected').text();
或$("#testSelect").find('option:selected').text();
或$("#testSelect").val();
JQuery中_Radio、DropDownList、Checkbox选择控件的处理的更多相关文章
- jquery mobiscroll移动端日期选择控件(无乱码)
jquery mobiscroll移动端日期选择控件(无乱码) <pre><!DOCTYPE html><html lang="en">< ...
- JQuery好用的日期选择控件 DatePicker
近期发现一个很好的基于JQ的前端UI日期选择控件Jquery.DatePicker.js 下载地址:jquery.DatePIcker.js 演示地址:DatePicker - 基于jQuery 1. ...
- asp.net中的时间日期选择控件
asp.net中的时间日期选择控件 Posted on 2008-07-17 17:37 飛雪飄寒 阅读(22922) 评论(6) 编辑 收藏 在系统中经常需要进行时间日期选择(比如查询时间范 ...
- thinter中combobox下拉选择控件(九)
combobox控件,下拉菜单控件 combobox控件在tkinter中的ttk下 简单的实现下: import tkinter from tkinter import ttk # 导入ttk模块, ...
- tkinter中combobox下拉选择控件(九)
combobox控件,下拉菜单控件 combobox控件在tkinter中的ttk下 简单的实现下: import tkinter from tkinter import ttk # 导入ttk模块, ...
- 如何解决FormView中实现DropDownList连动选择时出现 "Eval()、XPath() 和 Bind() 这类数据绑定方法只能在数据绑定控件的上下文中使用" 的错误
原文:如何解决FormView中实现DropDownList连动选择时出现 "Eval().XPath() 和 Bind() 这类数据绑定方法只能在数据绑定控件的上下文中使用" 的 ...
- asp.net mvc中使用jquery H5省市县三级地区选择控件
地区选择是项目开发中常用的操作,本文讲的控件是在手机端使用的选择控件,不仅可以用于实现地区选择,只要是3个级别的选择都可以实现,比如专业选择.行业选择.职位选择等.效果如下图所示: 附:本实例asp. ...
- 通用数据水平层级选择控件v0.70升级版使其支持jQuery v1.9.1
升级原因:作者原来脚本支持的jquery版本太低了,查找了下资料,使得它能支持最新版本的jquery 备注说明:脚本代码源作者跟源文出处很难找,只能在此特感谢他的分享. 更新部分: 1.新版本不再支持 ...
- 打造基于jQuery的日期选择控件
终于把jQuery拼写正确了哈,哈哈javascript也是区分大小写的,所以确实不能写错,今天我来和大家分享的是日期选择控件的实现,功能也许不够强大,但是能够满足需求. 我之前也写过(正确的说是改过 ...
随机推荐
- 【转】ASP.NET MVC 入门教程列表
ASP.NET MVC小论 2008-12-04 11:11 by T2噬菌体, 8052 visits, 网摘, 收藏, 编辑 摘要:ASP.NET MVC作为微软官方的.NET平台下MVC解决方案 ...
- 利用CMake自己创建OpenCV静态链接库
1.准备工作: 1)完成Visual Studio2012安装: 2)下载并解压CMake3.5.0: 3)下载并解压OpenCV2.4.12: 4)下载并解压TBB44_20160128oss. 2 ...
- tbody 滚动条
ARRIVALS TO BRISTOL - ENGLAND FLIGHT CODE FROM STA ETA Notes T3 4264 ISLE OF MAN 11:40 11:42 LANDED ...
- 绑定下拉框时避免触发SelectedIndexChanged事件
在从数据库读取数据集绑定到下拉框时会立即触发其SelectedIndexChanged事件造成异常,可对其SelectedIndexChanged事件采取先解除后附加的方法解决. cmbXl_gt.V ...
- PHP时间戳和日期相互转换
在php中我们要把时间戳转换日期可以直接使用date函数来实现,如果要把日期转换成时间戳可以使用strtotime()函数实现,下面我来给大家举例说明. 1.php中时间转换函数 strtotime ...
- 通用方法解决dedecms导航调用二级、三级栏目菜单
博客之前做网站的时候经常会遇到二级菜单.三级菜单.了解dede的人都知道从5.5版本开始都有二级菜单的调用方法了,网上也有不少的教程文章.不过这个调用需要修改dede源码的二级菜单样式.个人感觉不是很 ...
- Tomcat虚拟主机配置
3.1.配置虚拟主机 配置虚似主机就是配置一个网站. 在Tomcat服务器配置一个虚拟主机(网站),需要修改conf文件夹下的server.xml这个配置文件,使用Host元素进行配置,打开serve ...
- python【第九篇】多线程、多进程
内容提要 paramiko模块 进程.与线程区别 python GIL全局解释器锁 多线程 语法 join 线程锁之Lock\Rlock\信号量 将线程变为守护进程 Event事件 queue队列 生 ...
- hdu3652B-number
Problem Description A wqb-number, or B-number for short, is a non-negative integer whose decimal for ...
- linux系统下root用户和普通用户的时区不一致
1. 发现这个问题是在root下执行 date -R 和 普通用户下执行 date -R,发现时区不一致 2. 在一些linux机器下,发现是一致的 3. 什么原因呢?找了半天,最后发现 时区一致的机 ...
