js 动态添加字段

<table>
        <tr>
           <td width="84" align="center" valign="top" id="rights" style="padding-bottom:5px;">    <select size="8" name="list2"  id="list2" runat="server"  style="width:63px;"  ondblclick="addOption'list2','list1','adds')">
                    option value="">1</option>
                    <option value="">2</option>
                    <option value="">3</option>
                    <option value="">4</option>
                    <option value="">5</option>
                </select>
            </td>
            <td width="50" align="left" valign="top" style="padding-top:10px;">
                <input type="button" value="<< 移除" onclick="addOption('list1','list2','dells')" id="dell" />
                    <br />
                <input type="button" value="添加 >>" onclick="addOption('list2','list1','adds')" name="B1" id="adds"  />
            </td>
            <td width="86" align="center" valign="top" id="lefts" style="padding-bottom:5px;">
     <select  name="list1" id="list1" runat="server" size="8" style="width:63px;" ondblclick="addOption('list1','list2','dells')">
                    <option value="" >6</option>
                    <option value="">7</option>
                    <option value="">8</option>
                    <option value="">9</option>
                    <option value="">10</option>
                </select>
            </td>
            <td width="50" align="left" valign="top" style="padding-top:10px;">
               <input type="button" value="上移"  onclick="ListUtil.shiftUp(this.form.list1);" id="upmove"/>
                <br/>
                <input type="button" value="下移" onclick="ListUtil.shiftDown(this.form.list1);"  id="downmove"/>
                <br />
                <input type="button" value="确认" id="quren" onclick="Query();"/>
            </td>
        </tr>
    </table>

<script type="text/javascript">
var ListUtil = new Object();
function addOption(v,v2,p){
    var nowIndex    = $(v).options.length;            
    var selectIndex = $(v).options.selectedIndex;
        
    if(selectIndex!==-1){  
        var selectText  = $(v).options[selectIndex].text;   
        var selectValue = $(v).options[selectIndex].value;  
        var newoption   = new Option(selectText,selectValue,false,false);
       }
       else{
       return false;
       }
     $(v2).options[$(v2).options.length] = newoption;
  delOption(v);
}
  //清空选种项
function delOption(v){
    var selectIndex = $(v).options.selectedIndex;
 $(v).options[selectIndex] = null;                
}

//上移
ListUtil.shiftUp = function(oListbox) {
  if(oListbox.selectedIndex > 0)
   {
   var oOption = oListbox.options[oListbox.selectedIndex];
   var oPrevOption;
   if($("list1").getElementsByTagName("option")[1].selected == true){
    oPrevOption = oListbox.options[oListbox.selectedIndex]; 
    $('upmove').disabled = true;
   }else{
    oPrevOption = oListbox.options[oListbox.selectedIndex-1]; 
    $('upmove').disabled = false;
   }
   oListbox.insertBefore(oOption,oPrevOption);
   }
}

//下移
ListUtil.shiftDown = function(oListbox){
  if(oListbox.selectedIndex < oListbox.options.length-1 && oListbox.selectedIndex > 0)
   {
   var oOption = oListbox.options[oListbox.selectedIndex];
   var oNextOption = oListbox.options[oListbox.selectedIndex+1];
   $('upmove').disabled = false;
   oListbox.insertBefore(oNextOption,oOption);
   }
}
//取得list1内的动态值
function Query()
{
  var hie=document.getElementById("ctl00_ContentPlaceHolder1_list1");
  var str="";
  for(var i=0;i<hie.options.length;i++)
  {
    str+=hie.options[i].value+",";
  }
  str=str.substring(0,str.length-1);
  ////document.getElementById("ctl00_ContentPlaceHolder1_hid").value=str;
 
  ////__doPostBack("ctl00$ContentPlaceHolder1$btnQu","");
}