<script src="https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/js/lib/jquery-1.10.2_d88366fd.js"></script>
<meta charset="utf-8">
<select id="slt">
<option value="aaaa">aaaa</option>
<option value="bbbb">bbbb</option>
<option value="cccc">cccc</option>
</select>
<div id="jtests">获取内容</div>
<div id="jtests_set">设置内容</div>
<script type="text/javascript">
$('#jtests').on('click', function() {
//获取选中项
var $slt=$("#slt").find("option:selected");
alert( '选中项html' + $slt.prop('outerHTML') );
//选中项下标
var index=$("#slt").get(0).selectedIndex;
alert( '选中项下标:' + index );
//根据属性值获取下标
var index=$("#slt").find('option[value="cccc"]').index();
alert( '属性值获取下标:' + index );
//根据内容值获取下标
var index=$("#slt").find('option:contains("cccc")').index();
alert( '根据内容值获取下标:' + index );
//获取所有下拉总数
var index=$("#slt").get(0).options.length;
alert( '获取所有下拉总数:' + index );
//设置下标
var index=$("#slt").get(0).selectedIndex=1;
});
//单击select事件
$("#slt").on('change', function() {
alert( $(this).find('option:selected').text() );
});
// 模拟触发事件
$('#jtests_set').on('click', function() {
$('#slt').trigger('change');
});
</script>
jq select 总结
最新推荐文章于 2022-08-31 11:04:35 发布