js使用DOM设置单选按钮、复选框及下拉菜单的方法(3)

<script type="text/javascript">
    function checkMultiple() {
 var oForm = document.forms["myForm1"];
 var oSelectBox = oForm.constellation;
 var aChoices = new Array();
 //遍历整个下拉菜单
 for (var i = 0; i < oSelectBox.options.length; i++)
     if (oSelectBox.options[i].selected) //如果被选中
  aChoices.push(oSelectBox.options[i].text); //压入到数组中
 alert("您选了：" + aChoices.join()); //输出结果
    }
</script>

<form method="post">
 <label for="constellation">星座：</label>
 <p>
     <select multiple="multiple">
  <option value="Aries">白羊</option>
  <option value="Taurus">金牛</option>
  <option value="Gemini">双子</option>
  <option value="Cancer">巨蟹</option>
  <option value="Leo">狮子</option>
  <option value="Virgo">处女</option>
  <option value="Libra">天秤</option>
  <option value="Scorpio">天蝎</option>
  <option value="Sagittarius">射手</option>
  <option value="Capricorn">摩羯</option>
  <option value="Aquarius">水瓶</option>
  <option value="Pisces">双鱼</option>
     </select>
 </p>
 <input type="button" value="查看选项" />
</form>

③. 通用取值（下拉单选和多选的情况）

复制代码 代码如下:

<script language="javascript">
    function getSelectValue(Box) {
 var oForm = document.forms["myForm1"];
 var oSelectBox = oForm.elements[Box]; //根据参数相应的选择下拉菜单
 if (oSelectBox.type == "select-one") { //判断是单选还是多选
     var iChoice = oSelectBox.selectedIndex; //获取选中项
     alert("单选，您选中了" + oSelectBox.options[iChoice].text);
 } else {
     var aChoices = new Array();
     //遍历整个下拉菜单
     for (var i = 0; i < oSelectBox.options.length; i++)
  if (oSelectBox.options[i].selected) //如果被选中
      aChoices.push(oSelectBox.options[i].text); //压入到数组中
     alert("多选，您选了：" + aChoices.join()); //输出结果
 }
    }
</script>

<form method="post">
    星座：
    <p>
 <select>
     <option value="Aries" selected="selected">白羊</option>
     <option value="Taurus">金牛</option>
     <option value="Gemini">双子</option>
     <option value="Cancer">巨蟹</option>
     <option value="Leo">狮子</option>
     <option value="Virgo">处女</option>
     <option value="Libra">天秤</option>
     <option value="Scorpio">天蝎</option>
     <option value="Sagittarius">射手</option>
     <option value="Capricorn">摩羯</option>
     <option value="Aquarius">水瓶</option>
     <option value="Pisces">双鱼</option>
 </select>
 <input type="button" value="查看选项" />
    </p>
    <p>
 <select multiple="multiple">
     <option value="Aries">白羊</option>
     <option value="Taurus">金牛</option>
     <option value="Gemini">双子</option>
     <option value="Cancer">巨蟹</option>
     <option value="Leo">狮子</option>
     <option value="Virgo">处女</option>
     <option value="Libra">天秤</option>
     <option value="Scorpio">天蝎</option>
     <option value="Sagittarius">射手</option>
     <option value="Capricorn">摩羯</option>
     <option value="Aquarius">水瓶</option>
     <option value="Pisces">双鱼</option>
 </select>
 <input type="button" value="查看选项" />
    </p>
</form>