select multiplt 多选代码及脚本

来源:互联网 发布:java分布式事务 编辑:程序博客网 时间:2024/06/11 12:35

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
sortitems = 1;  // Automatically sort items within lists? (1 or 0)

 function move(fbox,tbox) {
  for(var i=0; i<fbox.options.length; i++) {
    if(fbox.options[i].selected && fbox.options[i].value != "") {
    var no = new Option();
    no.value = fbox.options[i].value;
    no.text = fbox.options[i].text;
    tbox.options[tbox.options.length] = no;
    fbox.options[i].value = "";
    fbox.options[i].text = "";
       }
  }
 BumpUp(fbox);
 if (sortitems) SortD(tbox);
 }

   function moveall(fbox,tbox) {
  for(var i=0; i<fbox.options.length; i++) {
    if(fbox.options[i].value != "") {
    var no = new Option();
    no.value = fbox.options[i].value;
    no.text = fbox.options[i].text;
    tbox.options[tbox.options.length] = no;
    fbox.options[i].value = "";
    fbox.options[i].text = "";
       }
  }
 BumpUp(fbox);
 if (sortitems) SortD(tbox);
 }


 function BumpUp(box)  {
  for(var i=0; i<box.options.length; i++) {
    if(box.options[i].value == "")  {
       for(var j=i; j<box.options.length-1; j++)  {
       box.options[j].value = box.options[j+1].value;
       box.options[j].text = box.options[j+1].text;
       }
    var ln = i;
    break;
       }
  }
  if(ln < box.options.length)  {
  box.options.length -= 1;
  BumpUp(box);
     }
 }

function SortD(box)  {
 var temp_opts = new Array();
 var temp = new Object();
 for(var i=0; i<box.options.length; i++)  {
 temp_opts[i] = box.options[i];
 }

 for(var x=0; x<temp_opts.length-1; x++)  {
   for(var y=(x+1); y<temp_opts.length; y++)  {
     if(temp_opts[x].text > temp_opts[y].text)  {
     temp = temp_opts[x].text;
     temp_opts[x].text = temp_opts[y].text;
     temp_opts[y].text = temp;
     temp = temp_opts[x].value;
     temp_opts[x].value = temp_opts[y].value;
     temp_opts[y].value = temp;
        }
      }
 }

 for(var i=0; i<box.options.length; i++)  {
 box.options[i].value = temp_opts[i].value;
 box.options[i].text = temp_opts[i].text;
    }
}
// End -->
</script>

 

 

 

 

 

 

<script type="text/javascript">
   
   function ajGetArea(){
    var id = document.regForm.cityid.value;
    //if(id == 0){
    // alert('请选择城市!');
    // return false;
    //}
    var url = '<bean:message key="domainroot" bundle="appconfig"/>/biz/ajGetAreaList.do';
       var pars = 'id=' + id ;
    var mi= new Ajax.Request(url,{
          method: 'post',
          parameters: pars,
          onComplete: sh});
      }
      function sh(aj)
   {   
    var resp=aj.responseText;
    $('areadiv').innerHTML = resp;
   }
   
      function ajGetInfoGroup2()
   {
    var id = document.regForm.group1id.value;
    var url = '<bean:message key="domainroot" bundle="appconfig"/>/biz/ajxGetGroup2List.do';
       var pars = 'id=' + id ;
    var mi= new Ajax.Request(url,{
          method: 'post',
          parameters: pars,
          onComplete: gh});
      }    
      function gh(aj)
   {   
    var resp=aj.responseText;
    $('type2div').innerHTML = resp;
    
    var a = document.getElementById('list2').options.length;
    alert(a+'heha');
    //将对象中所选的项删除
    removeall(document.regForm.list2);
   }
   
   function removeall(fbox) {
    alert(fbox.options.length);
     for(var i=0; i<fbox.options.length; i++) {
      alert(fbox.options[i].value);
        fbox.options[i].value = "";
        fbox.options[i].text = "";
       }
   }
 
   
   
  </script>

 

 

 

 

 

 

<table>

<form name="regForm" id="regForm" method="post" action="bizReg.do" onsubmit="javascript:return checkForm();">

<tr>
     <td valign="top" align="right"><span class="red">* </span>类别:</td>
     <td>
     <select name="group1id" id="group1id" onchange="ajGetInfoGroup2();">
   <option value="0">--请选择--</option>
   <logic:notEmpty name="group1list">
    <logic:iterate id="element" name="group1list">
     <option value="<bean:write name="element" property="id"/>"><bean:write name="element" property="groupname"/></option>
    </logic:iterate>
   </logic:notEmpty>
 
  </select>
         &nbsp;<span id="group1id_req"></span>
         <br>
         <div >
   <table width="400" border="0" cellpadding="0" cellspacing="0">
       <tbody>
       <tr>
   
         <td align="center">可选择</td>
         <td></td>
         <td align="center">已选择</td>
       </tr>
       <tr>
      
        <td width="40%">
         <div id="type2div">
          <select size="10" name="list1" multiple="multiple"  style="width: 100%;">
       
      
       </select>
         </div>
         
      
     </td>
     <td width="10%" align="center">
     
      <!-- <a href="#" onclick="javascript:move(this.form.list1,this.form.group2ids)"><img src="../img/1.gif"></a>
      <br>
      <a href="#" onclick="move(this.form.group2ids,this.form.list1)"><img src="../img/2.gif"></a> -->
      
      <input type="button" value="   >   " onclick="move(this.form.list1,this.form.list2)" name="B1">
 
      <input type="button" value="   <   " onclick="move(this.form.list2,this.form.list1)" name="B2">
      
      
      
      <input type="button" value="   >>   " onclick="moveall(this.form.list1,this.form.list2)" name="B3">
      
      <input type="button" value="   <<   " onclick="moveall(this.form.list2,this.form.list1)" name="B4">
      
           
     </td>
          <td width="40%">
     <select size="10" name="list2" id="list2" multiple="multiple" style="width: 100%;">
     
     </select>
     
     </td>
     
     
       </tr>
      
       <input name="group2ids" type="hidden"/>
      </tbody>
     </table>
   </div>
  </td>
   </tr>

</form>

</table>

原创粉丝点击