<select>中如何去动态的增加一个选项

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
</HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
function selChange(){ var objselect = document.all.select;
var objcheckbox = document.all.checkbox;
var selectLen = objselect.length ;
var checkboxLen = objcheckbox.length; var i; //alert ( selectLen );
//alert ( checkboxLen ); if(checkboxLen > 0){ //alert ( checkboxLen ); for(i = 0 ;i < checkboxLen;i++){

//alert ( i ); if(objcheckbox[i].checked == true){ //alert ( objcheckbox[i].checked ); if (selectLen == 0){ //alert ( "P1" ); objselect.length = 1; objselect.options[0].value = objcheckbox[i].value;
objselect.options[0].innerHTML =  objcheckbox[i].value;

selectLen = objselect.length ;
}
else{ //alert ( "P2" ); objselect.length = objselect.length + 1;
selectLen = objselect.length ; objselect.options[selectLen-1].value = objcheckbox[i].value;
objselect.options[selectLen-1].innerHTML =  objcheckbox[i].value;
selectLen = objselect.length ;
}
}
}
//alert( objselect.length );
}}
function selDel(){ var objselect = document.all.select;
var objcheckbox = document.all.checkbox;
var selectLen = objselect.length ;
var checkboxLen = objcheckbox.length; var i;
var j;
var k; i=0;
j=0;
k=0; //alert( selectLen ); if(selectLen == 0){ alert ( 'no values' );
return 0;
} for(i = selectLen;i > 0;i--){

//alert ( i ); if(objselect.options[i-1].selected == true){

//alert( "Value of now: \n" + objselect.options[i-1].value ); /**/
for(j = i;j < selectLen;j++){ objselect.options[j-1].value = objselect.options[j].value;
objselect.options[j-1].text = objselect.options[j].text;
//alert( j + "つ目：\n" + objselect.options[j].value + "->" + objselect.options[j-1].value );
}
k = k + 1; } }
objselect.length = objselect.length - k;
selectLen = objselect.length ;
}
//-->
</SCRIPT>
<BODY>
<form name="form1" method="post" action="">
  <table width="100%" height="282" border="0" cellpadding="0" cellspacing="0">
    <tr> 
      <td width="12%" height="42" rowspan="2"></td>
      <td colspan="2">&nbsp;</td>
      <td width="13%" rowspan="5" align="center" valign="top"> 
        <input type="button" onClick="selChange()" value="添加"> 
<input type="button" onClick="selDel()" value="消す">
      </td>
      <td width="47%" rowspan="5" valign="top">
<select name="select" size="1" multiple style="width:200px;height:200px">
</select>
</td>
    </tr>
    <tr> 
      <td rowspan="2">&nbsp;</td>
      <td width="24%"><input type="checkbox" name="checkbox" value="川">川</td>
    </tr>
    <tr> 
      <td rowspan="2">&nbsp;</td>
  <td colspan="2"><input type="checkbox" name="checkbox" value="局">局</td>
    </tr>
    <tr> 
      <td rowspan="2">&nbsp;</td>
      <td colspan="2"><input type="checkbox" name="checkbox" value="国">国</td>
    </tr>
    <tr> 
      <td colspan="3">&nbsp;</td>
    </tr>
  </table>
</form></BODY>
</HTML>

解决方案 »

  1.   

    <script>
    var arr=[["a","3.14"]];
    function add()
    {
      var obj=document.getElementsByName('s1')[0];
      obj.options[obj.options.length]=new Option(arr[0][0],arr[0][1]);
    }
    </script>
    <body>
    <select name="s1">
    <option>选项
    </select>
    <input type=button value=add onclick="add()">
    </body>
      

  2.   

    请问:var obj=document.getElementsByName('s1')[0];
    [0]是取得所有name为's1'的集合吗?那么我的怎个页面中只有一个s1,为什么去掉这个[0]运行就要报错呢??
    [0]在这里是什么意思呀?干什么用的呢?
      

  3.   

    obj.options.add(new Option("aaaaa","1111"));
      

  4.   

    document.getElementsByName('s1')是一个集合，而后面加[0]表示集合里的第一个元素。