select设置选中项/select的级联

一、selected="selected"

HTML通过<select>的属性来设置选中项，

此方法也可以在动态语言在后台根据需要控制输出结果。

<select ID='sel' class="form-control width150">  
 <option value="1">开启</option>  
<option selected="selected" value="0">关闭</option>   <!-- selected="selected" 默认选择 -->
</select>

 

二、js来设置选中项：修改selected属性值

<script >
var  ss = document.getElementById('sel');
ss[0].selected = true;//选中
</script>

 

三、jquery设置选中项- 设置指定value为项中

  1.设置value为vxx的项选中

   $(".selector").val("vxx");

     如：   $("#sel").eq(0).val("0");    

 

 

四、jquery设置选中项- 设置指定text为项中  

1.设置text为txx的项选中

    $(".selector").find("option:contains('pxx')").attr("selected",true);

  $(".select").eq(0).find("option:contains('关闭')").attr("selected", true);
            var opt = $(".select").eq(0).find("option:contains('关闭')");
            console.log(opt);                         //obj {...}
            console.log(    opt.attr("selected"));  // selected

第四行 显示结果——

 selected

 

  2.注意：

  $(".selector").find("option[text='pxx']").attr("selected",true); 不可行

  var opt = $(".select").eq(0).find("option[text='关闭']");
   console.log(opt);                                      //obj{...}
   console.log(    opt.attr("selected"));            // undefined

第三行显示结果——

undefined

 

3、注意：获取当前选中项的value

    $(".selector").val();

4、注意：获取当前选中项的text

    $(".selector").find("option:selected").text();

 

五、select的级联

即第二个select(obj2)的值随着第一个select(obj1)选中的值变化，第三个第四个等其他select(other)也跟着变化

function GetChildrenData(dataobj, obj1, obj2,  other) {
    obj1.change(function () {

        var obj2Text = obj2.find("option").eq(0).text(); //请选择...
        obj2.empty();
        obj2.append('<option value="">' + obj2Text + '</option>');
     

        if(other !=null )
        for (var i = 0; i < other.length; i++) {
            var otherText = other[i].find("option").eq(0).text(); //请选择...
            other[i].empty();
            other[i].append('<option value="">' + otherText + '</option>');
        }
        if ($(this).val() != "") {
            dataobj.GetChildredData($(this).val(), function (re) {
                try {
                    var ds = JSON.parse(re.value).Table;
                    for (var i = 0; i < ds.length; i++) {
                        obj2.append('<option value="' + ds[i].ID + '">' + ds[i].Name + '</option>');
                    }
                } catch (e) { }
            })
        }
    })
}