yeafee@夜飞郎

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html  xmlns ="http://www.w3.org/1999/xhtml" >
< head >
< meta  http-equiv ="Content-Type"  content ="text/html; charset=gb2312"   />
< title > Option Element  Move </ title >
< style  type ="text/css" >
<!--
.STYLE1  {} {} {} {
    color :  #FF0000 ;
    font-weight :  bold ;
}
-->
</ style >
< script  language ="javascript" >
function  checkCallCenterChange(sourceSelect, targetSelect) {
    
     var  unFinished  =   " P001,P002,P003 " ;   // 不可以移动的操作项   
      if  (sourceSelect.selectedIndex  >   - 1 )  {
          // 遍历检查不可移动项
          for  (i = 0 ; i  <  sourceSelect.length;  ++ i) {
             var  selectedOption  =  sourceSelect.options[i];
             if  (selectedOption.selected) {                
                 var  str  =  selectedOption.value;                
                 if (isContain(unFinished,str) == 'Y') {
                 selectedOption.selected = false ;
                   alert( " 操作项\ "" +selectedOption.text+ " \ " 未完成! " );
                }
            }  
        }         
    }         
    SelectOptionsElementMove(sourceSelect, targetSelect);    
}

function  isContain(srcStr,str) {
   var  flag = " N " ;
   var  aryA;
   if (srcStr.indexOf( " , " ) !=- 1 ) {
       aryA =  srcStr.split( " , " );
        for ( var  i = 0 ;i < aryA.length;i ++ ) {      
        if (aryA[i] == str) {               
           flag = " Y " ;
            continue ;
      }
     }
  } else {
      if (srcStr == str) {
          flag = " Y " ;
       }
  }
   return  flag;
}

function  SelectOptionsElementMove(sourceSelect, targetSelect)  {    
     if  (sourceSelect.selectedIndex  >   - 1 ) {
         // begin 将sourceSelect.option中的选中项移到targetSelect.option中
         for  (i = 0 ; i  <  sourceSelect.length;  ++ i) {
             var  selectedOption  =  sourceSelect.options[i];
             if  (selectedOption.selected) {
                 var  newOption  =   new  Option(selectedOption.text, selectedOption.value);
                targetSelect.options[targetSelect.options.length]  =  newOption;
            }  
        } // end
        
         // begin 去除sourceSelect 中的选中项
         for  (i = sourceSelect.length - 1 ; i  >   - 1 ; i -- ) {
             if  (sourceSelect.options[i].selected)  {
                  sourceSelect.options[i]  =   null ;
                }                 
        } // end
    }
}
</ script >
</ head >

< body >
< form  name ="fromName"  method ="post"  action ="actionName"  target ="edit" >
< table  width =100%  border =0  align =center  class ="main-table" >
< tr  align ="center" >
            < td  >
            < TABLE  border ="0"  width ="60%"
                cellspacing ="0"  cellpadding ="0"  height ="100%" >
                 < TBODY >
                     < TR >
                         < TD  width ="25%"  rowspan ="2"  height ="38"  align ="center"
                            valign ="middle" > 未被选中
                
                         < select  name ="unSelectedItem"  multiple ="multiple"  size ="7"  ondblclick ="checkCallCenterChange(this,selectedItem);"  style ="width: 100%; height: 110" >
< option  value ="P001" > 变更一 </ option >
< option  value ="P002" > 变更二 </ option >
< option  value ="P003" > 变更三 </ option >
< option  value ="P004" > 变更四 </ option >
< option  value ="P005" > 变更伍 </ option >
< option  value ="P006" > 变更陆 </ option >
< option  value ="P007" > 变更柒 </ option >
< option  value ="P008" > 变更拐 </ option >
< option  value ="P009" > 变更玖 </ option >
< option  value ="P010" > 变更拾 </ option >
< option  value ="P011" > 变更11 </ option >
< option  value ="P012" > 变更12 </ option >
</ select >
                         </ TD >
                         < TD  width ="10%"  align ="center"  valign ="middle" >
                     < INPUT     onclick ="checkCallCenterChange(document.forms[0].unSelectedItem,document.forms[0].selectedItem);"  type ="button"  value =" 〉〉"  name ="B4" >
                             </ TD >
                         < TD  width ="25%"  rowspan ="2"  height ="38"  align ="center"
                            valign ="middle" > 被选中
                    
                     < select  name ="selectedItem"  multiple ="multiple"  size ="7"  ondblclick ="checkCallCenterChange(this,unSelectedItem);"  style ="width: 100%; height: 110" ></ select >
                         </ TD >
                     </ TR >
                     < TR >
                         < TD  width ="10%"  align ="center"  valign ="middle" >  
                     < INPUT  onclick ="checkCallCenterChange(document.forms[0].selectedItem,document.forms[0].unSelectedItem);"  type ="button"  value ="〈〈 "  name ="B2" >
                         </ TD >
                     </ TR >
                 </ TBODY >
             </ TABLE >
            </ TD >
         </ TR >
</ table >         
</ body >