
jQuery是控制和 *** 作select详解。
先看下面的html代码
<select id="test">
<option value="1">选项一<option>
<option value="2">选项一<option>
<option value="n">选项N<option>
</select>
所谓jQuery *** 作“select”, 说的更确切一些是应该是jQuery控制 “option”, 看下面的jQuery代码:
//获取第一个option的值
$('#test option:first')val();
//最后一个option的值
$('#test option:last')val();
//获取第二个option的值
$('#test option:eq(1)')val();
//获取选中的值
$('#test')val();
$('#test option:selected')val();
//设置值为2的option为选中状态
$('#test')attr('value','2');
//设置最后一个option为选中
$('#test option:last')attr('selected','selected');
$("#test")attr('value' , $('#test option:last')val());
$("#test")attr('value' , $('#test option')eq($('#test option')length - 1)val());
//获取select的长度
$('#test option')length;
//添加一个option
$("#test")append("<option value='n+1'>第N+1项</option>");
$("<option value='n+1'>第N+1项</option>")appendTo("#test");
//添除选中项
$('#test option:selected')remove();
//删除项选中(这里删除第一项)
$('#test option:first')remove();、
//指定值被删除
$('#test option')each(function(){
if( $(this)val() == '5'){
$(this)remove();
}
});
$('#test option[value=5]')remove();
//获取第一个Group的标签
$('#test optgroup:eq(0)')attr('label');
//获取第二group下面第一个option的值
$('#test optgroup:eq(1) : option:eq(0)')val();
Jquery获取select选中项 自定义属性的值的方法:
示例代码:
1、html代码:
<!DOCTYPE>
<html>
<head>
<meta >
#lili{font-weight:bold;color:red;}
</style>
</head>
<body>
<select id="mysel" title="选择提示">
<option>nba</option>
<option>fifa</option>
</select>
<script>
</script>
</body>
<html>
2、jquery代码获取自定义属性:
使用attr(name)获取title值:
<script>
alert($("#mysel")attr("title"));
</script>
3、显示结果:
单选下拉列表框对象的value属性值就是选中项的value值,因此只需用如下代码即可
1
var selected_val = documentgetElementById(select_id)value;
并且,通过 *** 作select下的option也可以得到被选项的value值,方法为:
var sel = documentgetElementById(select_id);
var selected_val = seloptions[selselectedIndex]value;
实例演示如下:
1、HTML结构及javascript代码
<select id="test" onchange="alert(thisvalue)">
<option value="0">options-0</option>
<option value="1">options-1</option>
<option value="2">options-2</option>
</select>
jQuery获取Select元素,并设置的 Text和Value:
$("#select_id ")get(0)selectedIndex=1; //设置Select索引值为1的项选中
$("#select_id ")val(4); // 设置Select的Value值为4的项选中
$("#select_id option[text='jQuery']")attr("selected", true); //设置Select的Text值为jQuery的项选中
jQuery添加/删除Select元素的Option项:
$("#select_id")append("<option value='Value'>Text</option>"); //为Select追加一个Option(下拉项)
$("#select_id")prepend("<option value='0'>请选择</option>"); //为Select插入一个Option(第一个位置)
$("#select_id option:last")remove(); //删除Select中索引值最大Option(最后一个)
$("#select_id option[index='0']")remove(); //删除Select中索引值为0的Option(第一个)
$("#select_id option[value='3']")remove(); //删除Select中Value='3'的Option
$("#select_id option[text='4']")remove(); //删除Select中Text='4'的Option
三级分类 <select name="thirdLevel" id="thirdLevel"
onchange="getFourthLevel()">
<option value="0" id="thirdOption">
请选择三级分类
</option>
</select>
</div>
四级分类:
<select name="fourthLevelId" id="fourthLevelId">
<option value="0" id="fourthOption">
请选择四级分类
</option>
</select>
</div>
if($("#thirdLevel")val()!=0){
$("#thirdLevel option[value!=0]")remove();
}
if($("#fourthLevelId")val()!=0){
$("#fourthLevelId option[value!=0]")remove();
}//这个表示:假如希望当选择选择第三类时:如果第四类中有数据则删除,如果没有数据第四类的商品中的为默认值。
获取Select :
获取select 选中的 text :
$("#ddlRegType")find("option:selected")text();
获取select选中的 value:
$("#ddlRegType ")val();
获取select选中的索引:
$("#ddlRegType ")get(0)selectedIndex;
设置select:
设置select 选中的索引:
$("#ddlRegType ")get(0)selectedIndex=index;//index为索引值
以上就是关于jquery怎么获取select选中的值全部的内容,包括:jquery怎么获取select选中的值、Jquery怎么获取select选中项 自定义属性的值、如何利用javascript获取表单中select下拉列表中所选中项的值value等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)