`

动态改变Select列序的次序

阅读更多

今天要用,在网上找了一个,发现有错误,我已更正了。

<html>
<head>
<title>调整Select的位置</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<script language="JavaScript">
   function IsSelect(){
               if (document.formlist.IndexList.selectedIndex==-1){
                  alert("请选择一项!");
                  return false;
               }
         return true;
   }
   function UpList(i){
         var TempText;  //临时存放的名字
         var TempValue; //临时存放的值
         //alert(i)
         if (i==0){
            alert(document.formlist.IndexList.options[i].text + "已经到顶了!");
            return false;
         }
         TempText=document.formlist.IndexList.options[i].text;
         TempValue=document.formlist.IndexList.options[i].value;
         document.formlist.IndexList.options[i].text=document.formlist.IndexList.options[i-1].text;
         document.formlist.IndexList.options[i].value=document.formlist.IndexList.options[i-1].value;
         document.formlist.IndexList.options[i-1].text=TempText;
         document.formlist.IndexList.options[i-1].value=TempValue;
         document.formlist.IndexList.options[i-1].selected=true;
         document.formlist.IndexList.options[i].selected=false;
         TempText="";
         Tempvalue="";
         return true;
       }
       function DownList(i){
         var   TempText   //临时存放的名字
         var   TempValue //临时存放的值
         //alert(i)
         if (i==document.formlist.IndexList.length-1){
            alert(document.formlist.IndexList.options[i].text + "已到底了!");
            return false;
         }
         TempText=document.formlist.IndexList.options[i].text;
         TempValue=document.formlist.IndexList.options[i].value;
         document.formlist.IndexList.options[i].text=document.formlist.IndexList.options[i+1].text;
         document.formlist.IndexList.options[i].value=document.formlist.IndexList.options[i+1].value;
         document.formlist.IndexList.options[i+1].text=TempText;
         document.formlist.IndexList.options[i+1].value=TempValue;
         document.formlist.IndexList.options[i+1].selected=true;
         document.formlist.IndexList.options[i].selected=false;
         TempText="";
         Tempvalue="";
         return true;
       }
     
       function MoveList(ActionType)
       {
         var i=0;
         //判断是否有选中项
         if (!IsSelect()){ 
            return false;
         }
         //判断操作类型
         if (ActionType=="up"){
            for (i=0;i<document.formlist.IndexList.length;i++){
                  if (document.formlist.IndexList.options[i].selected){
                     if (!UpList(i))
                      return;                     
                  }
            }
         }
         //判断操作类型
         if (ActionType=="down") {
                for (i=document.formlist.IndexList.length-1;i>=0;i--){
                   if (document.formlist.IndexList.options[i].selected){
                     if (!DownList(i))
                            return;
                  }            
                }
         }
   if(ActionType == 'toTop'){
    for (i=document.formlist.IndexList.length-1;i>=0;i--){
                   if (document.formlist.IndexList.options[i].selected){
                     if (!toTop(i))
                            return;
                  }            
                }
   }
   if(ActionType == 'toDown'){
    for (i=document.formlist.IndexList.length-1;i>=0;i--){
                   if (document.formlist.IndexList.options[i].selected){
                     if (!toDown(i))
                            return;
                  }            
                }
   }
       }
   
       function dbClick(ActionType){
         MoveList(ActionType);
       }
   
    function toTop(i){
      if(!IsSelect()){ 
    return false;
   }
   var TempText;   //临时存放的名字
          var TempValue; //临时存放的值
   TempText=document.formlist.IndexList.options[0].text;
          TempValue=document.formlist.IndexList.options[0].value;
   document.formlist.IndexList.options[0].text=document.formlist.IndexList.options[i].text;
            document.formlist.IndexList.options[0].value=document.formlist.IndexList.options[i].value;
            document.formlist.IndexList.options[i].text=TempText;
            document.formlist.IndexList.options[i].value=TempValue;
            document.formlist.IndexList.options[0].selected=true;
            document.formlist.IndexList.options[i].selected=false;
    }
   
    function toDown(i){
      if(!IsSelect()){ 
    return false;
   }
   var TempText;   //临时存放的名字
          var TempValue; //临时存放的值
   var length = document.formlist.IndexList.length;
   TempText=document.formlist.IndexList.options[length-1].text;
          TempValue=document.formlist.IndexList.options[length-1].value;
   document.formlist.IndexList.options[length-1].text=document.formlist.IndexList.options[i].text;
            document.formlist.IndexList.options[length-1].value=document.formlist.IndexList.options[i].value;
            document.formlist.IndexList.options[i].text=TempText;
            document.formlist.IndexList.options[i].value=TempValue;
            document.formlist.IndexList.options[length-1].selected=true;
            document.formlist.IndexList.options[i].selected=false;
    }
   
</script>
<body leftmargin="0" topmargin="0">

<br>
<table width="23%" border="0" align="center">
   <form name="formlist" method="post" action=""><tr>
   <td width="12%" valign="top" >
       <select name="IndexList" size="16" multiple id="IndexList">
    <option value="1">第1列</option>
    <option value="2">第2列</option>
    <option value="3">第3列</option>
    <option value="4">第4列</option>
    <option value="5">第5列</option>
    <option value="6">第6列</option>
       </select>
   </td>
   <td width="88%" valign="top">
       <input type="button" name="Button" value="置顶" onClick="MoveList('toTop')" >
       <br>
       <input name="UPButton" type="button" id="UPButton" value="▲ 上移" onClick="MoveList('up')" >
       <br>
       <input name="DownButton" type="button" id="DownButton" value="▼ 下移" onClick="MoveList('down')" >
       <br>
       <input type="button" name="Submit2" value="置底" onClick="MoveList('toDown')" >
       <br>
   </td>
   </tr>
   <tr>
     <td colspan="2"></td>
   </tr>
   </form>
</table>
</body>
</html>

分享到:
评论

相关推荐

    MySQL中文参考手册

    * 0 译者序 * 1 MySQL的一般的信息 o 1.1 什么是MySQL? o 1.2 关于本手册 + 1.2.1 本手册中使用的约定 o 1.3 MySQL的历史 o 1.4 MySQL的主要特征 o 1.5 MySQL稳定性? o 1.6 顺应2000年 o 1.7 SQL一般信息...

    MySQL中文参考手册.chm

    MySQL中文参考手册.chm 449kb &lt;br/&gt;0 译者序 1 MySQL的一般的信息 1.1 什么是MySQL? 1.2 关于本手册 1.2.1 本手册中使用的约定 1.3 MySQL的历史 1.4 MySQL的主要特征 1.5...

    Access 2000数据库系统设计(PDF)---001

    目 录译者序前言第一部分 Access基础第1章 Access 2000的新增功能 11.1 Access 2000透视 11.2 用Office Web组件部署数据访问页 21.2.1 Office Web 组件 21.2.2 DAP演示测试. 31.2.3 DAP设计模式 51.3 为Microsoft...

    Access 2000数据库系统设计(PDF)---002

    Access 2000数据库系统设计(PDF)---002目 录译者序前言第一部分 Access基础第1章 Access 2000的新增功能 11.1 Access 2000透视 11.2 用Office Web组件部署数据访问页 21.2.1 Office Web 组件 21.2.2 DAP演示测试....

    Access 2000数据库系统设计(PDF)---018

    Access 2000数据库系统设计(PDF)---018目 录译者序前言第一部分 Access基础第1章 Access 2000的新增功能 11.1 Access 2000透视 11.2 用Office Web组件部署数据访问页 21.2.1 Office Web 组件 21.2.2 DAP演示测试....

    Access 2000数据库系统设计(PDF)---003

    Access 2000数据库系统设计(PDF)---002目 录译者序前言第一部分 Access基础第1章 Access 2000的新增功能 11.1 Access 2000透视 11.2 用Office Web组件部署数据访问页 21.2.1 Office Web 组件 21.2.2 DAP演示测试....

    Access 2000数据库系统设计(PDF)---011

    Access 2000数据库系统设计(PDF)---011目 录译者序前言第一部分 Access基础第1章 Access 2000的新增功能 11.1 Access 2000透视 11.2 用Office Web组件部署数据访问页 21.2.1 Office Web 组件 21.2.2 DAP演示测试....

    Access 2000数据库系统设计(PDF)---020

    Access 2000数据库系统设计(PDF)---020目 录译者序前言第一部分 Access基础第1章 Access 2000的新增功能 11.1 Access 2000透视 11.2 用Office Web组件部署数据访问页 21.2.1 Office Web 组件 21.2.2 DAP演示测试....

    Access 2000数据库系统设计(PDF)---009

    Access 2000数据库系统设计(PDF)---009目 录译者序前言第一部分 Access基础第1章 Access 2000的新增功能 11.1 Access 2000透视 11.2 用Office Web组件部署数据访问页 21.2.1 Office Web 组件 21.2.2 DAP演示测试....

    Access 2000数据库系统设计(PDF)---012

    Access 2000数据库系统设计(PDF)---012目 录译者序前言第一部分 Access基础第1章 Access 2000的新增功能 11.1 Access 2000透视 11.2 用Office Web组件部署数据访问页 21.2.1 Office Web 组件 21.2.2 DAP演示测试....

    Access 2000数据库系统设计(PDF)---015

    Access 2000数据库系统设计(PDF)---015目 录译者序前言第一部分 Access基础第1章 Access 2000的新增功能 11.1 Access 2000透视 11.2 用Office Web组件部署数据访问页 21.2.1 Office Web 组件 21.2.2 DAP演示测试....

    Access 2000数据库系统设计(PDF)---025

    Access 2000数据库系统设计(PDF)---025目 录译者序前言第一部分 Access基础第1章 Access 2000的新增功能 11.1 Access 2000透视 11.2 用Office Web组件部署数据访问页 21.2.1 Office Web 组件 21.2.2 DAP演示测试....

    Access 2000数据库系统设计(PDF)---027

    Access 2000数据库系统设计(PDF)---027目 录译者序前言第一部分 Access基础第1章 Access 2000的新增功能 11.1 Access 2000透视 11.2 用Office Web组件部署数据访问页 21.2.1 Office Web 组件 21.2.2 DAP演示测试....

    Access 2000数据库系统设计(PDF)---026

    Access 2000数据库系统设计(PDF)---026目 录译者序前言第一部分 Access基础第1章 Access 2000的新增功能 11.1 Access 2000透视 11.2 用Office Web组件部署数据访问页 21.2.1 Office Web 组件 21.2.2 DAP演示测试....

    Access 2000数据库系统设计(PDF)---029

    Access 2000数据库系统设计(PDF)---029目 录译者序前言第一部分 Access基础第1章 Access 2000的新增功能 11.1 Access 2000透视 11.2 用Office Web组件部署数据访问页 21.2.1 Office Web 组件 21.2.2 DAP演示测试....

Global site tag (gtag.js) - Google Analytics