jquery操作select radio box实例代码

作者：袖梨 2022-11-14

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 { if($("#ddlRegType ").get(0).options[i].text == text)
{
$("#ddlRegType ").get(0).options[i].selected = true;

break;
}
}

$("#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); });

相关文章

精彩推荐