最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
jquery操作select radio box实例代码
时间:2022-11-14 22:03:28 编辑:袖梨 来源:一聚教程网
select框操作
获取值
代码如下 | 复制代码 |
$('#select').val() |
设置值为xx的项为选中
代码如下 | 复制代码 |
$('#select').val(xx) |
设置文本信息为yy的项为选中
代码如下 | 复制代码 |
$('#select option[text="yy"]').attr("selected", true); |
获取select选中的索引:
代码如下 | 复制代码 |
$("#ddlRegType ").get(0).selectedIndex; |
设置select:
设置select 选中的索引:
代码如下 | 复制代码 |
$("#ddlRegType ").get(0).selectedIndex=index;//index为索引值 |
设置select 选中的value:
代码如下 | 复制代码 |
$("#ddlRegType ").attr("value","Normal“); $("#ddlRegType ").val("Normal"); $("#ddlRegType ").get(0).value = value;
|
设置select 选中的text:
代码如下 | 复制代码 |
var count=$("#ddlRegType option").length; for(var i=0;i
$("#select_id option[text='jQuery']").attr("selected", true); |
设置select option项:
代码如下 | 复制代码 |
$("#select_id").append(""); //添加一项option $("#select_id").prepend(""); //在前面插入一项option $("#select_id option:last").remove(); //删除索引值最大的Option $("#select_id option[index='0']").remove();//删除索引值为0的Option $("#select_id option[value='3']").remove(); //删除值为3的Option $("#select_id option[text='4']").remove(); //删除TEXT值为4的Option |
radio box 操作
获取值
代码如下 | 复制代码 |
$('input[name="xx"]:checked').val() |
设置值为xx的为选中
代码如下 | 复制代码 |
$('input[name="xx"]:radio[value="yy"]').attr('checked', 'checked'); |
获取一组radio被选中项的值
代码如下 | 复制代码 |
var item = $('input[@name=items][@checked]').val(); $("input[@type=radio][@checked]").val(); |
2设置.radio单选组
1.$('input[@name=items]').get(1).checked = true; //第二个元素为当前选中值
2. $("input[@type=radio][@value=2]").attr("checked",true);//设置value=2的项目为当前选中项
下面看一些常用的实例
下拉框的HTML代码
代码如下 | 复制代码 |
注意这里的select的id是“select”
添加“江苏”到下拉框的最后一位
Javascript代码
代码如下 | 复制代码 |
$('#add_to_last').click(function(){ $('#select').append(' 江苏 '); }); |
添加“安徽”到下拉框的第一位
Javascript代码
代码如下 | 复制代码 |
$('#add_to_first').click(function(){ $('#select').prepend(' 安徽 '); }); |
获取当前的selectIndex(当前选中的下拉菜单的项目的索引)
Javascript代码
代码如下 | 复制代码 |
$('#get_select_index').click(function(){ alert($('#select option:selected').attr("index")); }); |
移除下拉菜单最后一个项目
Javascript代码
代码如下 | 复制代码 |
$('#remove_last_option').click(function(){ $('#select option:last').remove(); }); |
移除除了第一个之外的所有选项
代码如下 | 复制代码 |
$('#remove_all_option_except_first').click(function(){ $('#select option').not(':first').remove(); }); |
获取下拉菜单最大索引值
代码如下 | 复制代码 |
$('#get_max_index').click(function(){ var maxIndex=$("#select option:last").attr("index"); alert(maxIndex); }); |
相关文章
- 人们熟悉的寄居蟹属于以下哪种分类 神奇海洋11月21日答案 11-21
- 第五人格11.22共研服有什么更新 11月22日共研服更新内容介绍 11-21
- 原神恰斯卡怎么培养 11-21
- 无期迷途四星装束是谁 11-21
- 王者荣耀帝丹高中校服怎么获得 11-21
- 光遇姆明季后续版本怎么玩 11-21