js动态设置select中option选中

今天开发网站遇到一个小问题，如何动态通过js让select控件选中指定的值呢？在调试过程中，发现了amazeui这个ui组件的问题，使用它个组件的样式就无法通过selected=true设置为选中。

后来，去了官网查找了相关方法来实现，但是按照官网的代码并不能达到选中效果，最后无奈只能将样式去掉，使用HTML原有的样式，手动通过JS来实现这个功能。

js中如何判断value=2的option在select中确实存在这个下拉选项

假如有这样一个select

1 2 3 4 5

< select  id = "sel" >          < option  value = 1 >op1</ option >          < option  value = 2 >op2</ option >          < option  value = 3 >op3</ option >      </ select >

用jquery方法,返回1

1	alert($( "option[value=2]" , "#sel" ).length);

假如有这样一个select

1 2 3 4 5

< select  id = "sel" >          < option  value = 1 >op1</ option >          < option  value = 4 >op4</ option >          < option  value = 3 >op3</ option >      </ select >

用上面的方法返回0

解决办法

手动通过原生JS来实现：

/** 
 * 设置select控件选中 
 * @param selectId select的id值 
 * @param checkValue 选中option的值 
 * @author 标哥 
*/  
function set_select_checked(selectId, checkValue){  
    var select = document.getElementById(selectId);  

    for (var i = 0; i < select.options.length; i++){  
        if (select.options[i].value == checkValue){  
            select.options[i].selected = true;  
            break;  
        }  
    }  
}

然后通过这样来调用：

// 设置select选中该班组
set_select_checked('edit-group', group_id);

注意：不要传'#edit-group'，习惯了jquery，会出问题的~

问题虽然简单，但是记录下来，下次直接复制过来即可！