Jquery动态增加option及获取值遍历option相关⽅法data⾥的数据如下图：
html:
<select id="channel_id" name="channel">
</select>
js:
function getBaseOptionFun(){
$('#channel_id').empty();
$.ajax({
url: "../../ueIndexConfig/getOption.do",
type: "POST",
data: {
province_id:'',
channel_id:''
},
async : false,
success: function (data) {
console.log(data);
if(data.all_channel != "" && data.all_channel != null){jquery的attr属性
for(var i = 0; i < data.all_channel.length; i++){
$("#channel_id").append("<option value='"+data.all_channel[i].channel_id+"'>"+data.all_channel[i].channel_name+"</option>");//新增
}
$("#channel_id option:eq(0)").attr('selected', 'selected');//选中第⼀个
//$("#channel_id").append("<option value=''>请选择</option>");
}
},
fail: function (status) {
// 此处放失败后执⾏的代码
}
});
}
获取select 中选中的值
⽅法：
//获取select中值
$("#channel_id  option:selected").val();
//获取select中值channel_id
$("#channel_id").val();
//获取select中⽂本channel_name
$("#channel_id").text();  //$("#channel_id").find("option:selected").text();
//获取select 中下标值
$("#channel_id").get(0).selectedIndex;
//获取select 最⼤的index属性值
$("#channel_id option:last").attr("index");
//select选中索引有好多⽅式，
$('#someId').find('option:selected').selectedIndex;
$('#someId').find('option:selected').attr('selectedIndex');
这两种⽅式取不到索引值
$('#someId').prop('selectedIndex');
$('option:selected', '#someId').index();
$('#someId option').index($('#someId option:selected'))
//以上三种⽅式可以取到索引值
遍历option获取所有值
html:
<select id="channel_id" name="channel" datatype="*" nullmsg="请选择渠道"> <option value="1" selected="selected">掌上营业厅</option>
<option value="2">⽹上营业厅</option>
<option value="3">营业厅</option>
<option value="8">能⼒开放平台</option>
</select>
js:
//⽅法1：
$(function(){
var array = new Array();  //定义数组
$("#channel_id option").each(function(){  //遍历所有option
var channlVal= $(this).val();  //获取option值
if(channlVal!=''){
array.push(channlVal);  //添加到数组中
}
})
}) ;
//⽅法2：
var channelArr= new Array();
var channel=$("#channel_id").find("option");
for(var i=0;i<channel.length;i++){
var channlVar=channl.eq(i).val();//option中的值
channelArr.push(channlVar);//添加到数组中
｝
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
5. $("#select_id option[text='4']").remove();  //删除Select中Text='4'的Option

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。