实现option上下移动_js 控制select下拉列表框中option选项的上下移动

代码如下：

复制代码 代码示例:

控制select下拉列表框中option选项的上下移动_www.jquerycn.cn

var x=null;

var listObj=null;

//鼠标按下不放时的操作

function setTimeStart(type)

{

listObj=document.getElementById('forder');

//超过0.3秒启动连续的向上(下)的操作

if(type=="up")

{

x=setTimeout(upListItem,300);

}else

{

x=setTimeout(downListItem,300);

}

}

//将选中item向上

function upListItem()

{

var selIndex=listObj.selectedIndex;

if(selIndex<0)

{

if(x!=null){clearTimeout(x);}

alert("请先选中一项！");

return;

}

if(selIndex==0)

{

if(x!=null){clearTimeout(x);}

alert("已经移到第一位！");

return;

}var selValue=listObj.options[selIndex].value;

var selText=listObj.options[selIndex].text;

listObj.options[selIndex].value=listObj.options[selIndex-1].value;

listObj.options[selIndex].text=listObj.options[selIndex-1].text;

listObj.options[selIndex-1].value=selValue;

listObj.options[selIndex-1].text=selText;

listObj.selectedIndex=selIndex-1;

if(selIndex+1>0)

{

x=setTimeout(upListItem,200)

}

}

//将选中item向下

function downListItem()

{

var selIndex=listObj.selectedIndex;

if(selIndex<0)

{

if(x!=null){clearTimeout(x);}

alert("请先选中一项！");

return;

}

if(selIndex==listObj.options.length-1)

{

if(x!=null){clearTimeout(x);}

alert("已经移到最后一位！");

return;

}var selValue=listObj.options[selIndex].value;

var selText=listObj.options[selIndex].text;

listObj.options[selIndex].value=listObj.options[selIndex+1].value;

listObj.options[selIndex].text=listObj.options[selIndex+1].text;

listObj.options[selIndex+1].value=selValue;

listObj.options[selIndex+1].text=selText;

listObj.selectedIndex=selIndex+1;

if(selIndex+1

{

x=setTimeout(downListItem,200)

}

}

οnclick="listObj=document.getElementById('forder');upListItem();clearTimeout(x);" ID="Button1" NAME="Button1"> οnmοuseup="clearTimeout(x);" οnclick="listObj=document.getElementById('forder');downListItem();clearTimeout(x);" ID="Button2" NAME="Button2"> 1 2 3 4 5 6 7 8 9