web select option

web select option

一个选项变动，同步其他选项。

<select>
  <option value ="volvo">Volvo</option>
  <option value ="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>

• option 元素定义下拉列表中的一个选项（一个条目）。
  • value 定义送往服务器的选项值
  • selected 规定选项表现为选中状态
  • selectedIndex 下拉列表中被选项目的索引号

实例

用id01元素控制id02和id03的元素值，同步使能情况。

<script>
    function hasEnable()
    {
        var own = document.getElementById("id01");
        var obj1 = document.getElementById("id02");
        var obj2 = document.getElementById("id03");
        
        var i = own.selectedIndex;
        if (i == 0 || i == 1)
        {
            obj1[i].selected = true;
            obj2[i].selected = true;
            return true;
        }
        return false;
    }
</script>
<select id="id01"  onchange="hasEnable();">
	<option value="0">enable</option>
    <option value="1">disable</option>
</select>

优化版本：

<script>
    function hasEnable(own)
    {
        var obj1 = $("#id02");
        var obj2 = $("#id03");
        
        var i = own.selectedIndex;
        if (i == 0 || i == 1)
        {
            obj1[i].selected = true;
            obj2[i].selected = true;
            return true;
        }
        return false;
    }
</script>
<select id="id01"  onchange="hasEnable(this);">
	<option value="0">enable</option>
    <option value="1">disable</option>
</select>