想用javascript动态在页面调入时，产生select。但有问题

谢谢，你说的那个确实可以实现
但我想我要用javascript，里面时间实现selecrt的关联
所有要用到javascript的数组来动态产生select
有办法吗

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<script language="JavaScript" type="text/JavaScript">

</script>
</head>
<body onload="init();">
<form  name="form1" method="post" action="">
  <select name="selectTest">
  </select>
</form>
</body>
</html>

Changing Selection List and Other Form Input Properties
One of the very useful features that JavaScript brings to your Web page is the ability to manipulate data that is already in the forms. For instance, if you were creating a form with which you planned to survey your Web site's visitors on their experience at the site, you might include something like, "Which products most interested you at this site? Select all that apply" and then a list all of the product lines sold on your Web site. You could list each product as a check box and require the visitor to click on each item that interested him or her. Unfortunately, if you have more than ten products this could get tedious. One alternative would be to place each item in a select box on your form and allow the user to select each item that interested him or her. Of course, if you used this approach, you would want to present the list in an ordered way so as to make answering the question as easy as possible. Before JavaScript, this would have been nearly impossible without hard-coding the list order into the HTML source. With JavaScript, you can now add items into the select box in any order and worry about sorting afterwards.This example has two select boxes in a form. The first select box contains the names of each month in the year and the second select box is empty. Two buttons allow you to move items to and from the first select box into the second. After each move, both select boxes are sorted.<html>
  <head>
    <title>
      JavaScript Professional Projects - Working with Forms
    </title>    <style type="text/css">
    
    </style>    <script language="JavaScript">
    
    </script>  </head>  <body>    <center>
      <font size=6>JavaScript Professional Projects</font><br>
      <font size=4>Chapter 8: Working with Forms</font>
    </center>    <br><br>
    <br><br>
    <form name="theForm">
      <table cellspacing="6">
        <tr>
          <td>
            <select size="12" name="ListA" multiple width="125">
              <script language="JavaScript">
              
              </script>
            </select>
          </td>          <td>
            <input type="button" value="=====>"
                 onClick="JavaScript: swapSelects( document.theForm.ListA,
                                                  document.theForm.ListB );">
            <br><br>
            <input type="button" value="<====="
                 onClick="JavaScript: swapSelects( document.theForm.ListB,
                                                  document.theForm.ListA );">
          </td>          <td>
            <select size="12" name="ListB" multiple
                     width="125"></select>
            <script language="JavaScript">
            
            </script>
           </td>
          </tr>
        </table>
     </form>  </body>
</html>This small example contains two very useful bits of code. The first function, swapSelects(), function swapSelects( fromSelect, toSelect )
{
  var toSelect_Length = toSelect.options.length;
  while( fromSelect.selectedIndex > -1 )
  {
    var index = fromSelect.selectedIndex;    toSelect.options[toSelect_Length] = new Option(
      fromSelect.options[index].text );
    toSelect.options[toSelect_Length].value =
      fromSelect.options[index].value;
    fromSelect.options[index] = null;    toSelect_Length++;
  }  sortSelect( fromSelect );
  sortSelect( toSelect );
}will take all of the selected elements out of fromSelect and put them into toSelect At the end of the swapSelect() function, both select boxes are sorted with the following function, sortSelect():function sortSelect( select )
{
  var a = new Array();
  for( i = 0; i < select.options.length ; i++ )
  {
   a[a.length] = new Option( select.options[i].text,
                               select.options[i].value,
                               select.options[i].defaultSelected,
                               select.options[i].selected ) ;
  }  a = a.sort(
      function( s, t )
      {
        return( s.text.compareTo( t.text ) );
      }
  );  for( i = 0; i < a.length ; i++ )
  {
    select.options[i] = new Option( a[i].text,
                                       a[i].value,
                                       a[i].defaultSelected,
                                       a[i].selected );
  }
}

var oOption;
for(i = 0;i< State.length;i++)
{
oOption = document.createElement('OPTION');
oOption.text = " " + State[i]+ " ";
oOption.value = State[i];
form1.Select1.options.add(oOption);
}
State是个数组

还有些问题
比如我用
//页面载入时候调用的function
function init() {
var where = new Array(5);
where[0]=("x");
where[1]=("xx");
where[2]=("xxx");
where[3]=("xxxx");
where[4]=("xxxxx");
var sel=document.form1.selectTest;
for (var i=0; i < 5; i++) {
sel.options[i] = new Option(where[i]); }
}
这时页面动态产生的select里面会有x,xx,xxx,xxxx,xxxxx五个选择
然后我设置一个事件让他相应
//change方法
function change() {
var bbb = new bbb(2);
bbb[0]=("y");
bbb[1]=("y");
var sel=document.form1.selectTest;
for (var i=0; i < 2; i++) {
sel.options[i] = new Option(bb[i]); }
}
然后再看select发现里面还是五个选项，分别是y,yy,xxx,xxxx,xxxxx
但我想让他相应了这个事件后，里面只有y,yy两个选项，应该怎么搞定呢？谢谢

调试易

想用javascript动态在页面调入时，产生select。但有问题

解决方案 »