jquery 操作 select
1.page
<div>
<select name="album" id="album">
<option value="1">推荐</option>
<option value="2">排行</option>
<option value="3">分类</option>
<option value="4">搜索</option>
</select>
<div>
2.scripts
<script language="javascript" type="text/javascript" src="jquery-1.8.0.js"></script>
<script language="javascript" type="text/javascript" >
$(function(){
console.log("jquery do select");
$s = $("#album");
console.log($s);
//获取选项的value
console.log($s.val());
//获取选项的text
console.log($s.find("option:selected").text());
//清空
console.log("before clear size is "+$s.find("option").size());
$s.empty();
console.log("after clear size is "+$s.find("option").size());
//遍历追加
var ops = [{"v":1,"t":"推荐"},{"v":2,"t":"排行"},{"v":3,"t":"分类"},{"v":4,"t":"搜索"},{"v":5,"t":"我"}];
$(ops).each(function(i){
//添加下拉框的option
$("<option value="+this.v+">"+this.t+"</option>").appendTo($s);
});
//判断是否有选中项
console.log("选中项个数:"+$s.find("option[selected='selected']").size());
//遍历修改,把value+10
$s.find("option").each(function(i){
var $this = $(this);
var v = $this.val();
var t = $this.text();
//移除value=5的option
if(v==5){
$this.remove();
}
//对数字value增10,对text增+
if(!isNaN(v)){
$this.val(parseInt(v)+10);
$this.text(t+"+");
}
console.log($this.val());
});
//
});
</script>