列表项可上下移动的Multiple列表

网络整理 - 09-19
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META CONTENT="EditPlus">
<META CONTENT="">
<META CONTENT="">
<META CONTENT="">
<STYLE>
BODY, SELECT
{
    FONT-FAMILY: TIMES NEW ROMAN;
    FONT-SIZE: 10PT;
}
</STYLE>
<script LANGUAGE="javascript">
<!--
window.onload = initPage;
function initPage()
{
    btnPutUp.onclick    = putUp;
    btnPutDown.onclick    = putDown;

    btnGoUp.onclick    = goUp;
    btnGoDown.onclick    = goDown;
}

function putUp()
{
    var strTempValue;
    var strTempText;
    var intCurIndex;
    
    intCurIndex = sltFruit.selectedIndex;
    //alert("intCurIndex: " + intCurIndex);

    if (intCurIndex > 0)
    {
        strTempValue= sltFruit.options.item(intCurIndex).value;
        strTempText    = sltFruit.options.item(intCurIndex).text;
        //alert(strTempText + " - " + strTempValue);
        
        sltFruit.options.item(intCurIndex).value    = sltFruit.options.item(intCurIndex - 1).value;
        sltFruit.options.item(intCurIndex).text        = sltFruit.options.item(intCurIndex - 1).text;
        sltFruit.options.item(intCurIndex - 1).value= strTempValue;
        sltFruit.options.item(intCurIndex - 1).text    = strTempText;
        sltFruit.selectedIndex = intCurIndex - 1;
    }
}

function putDown()
{
    var strTempValue;
    var strTempText;
    var intCurIndex;
    var intIndexCount;
    
    intCurIndex    = sltFruit.selectedIndex;
    intIndexCount    = sltFruit.length;
    //alert("intCurIndex: " + intCurIndex);
    //alert("intIndexCount: " + intIndexCount);
    
    if (intCurIndex < intIndexCount - 1)
    {
        strTempValue= sltFruit.options.item(intCurIndex).value;
        strTempText    = sltFruit.options.item(intCurIndex).text;
        //alert(strTempText + " - " + strTempValue);
        
        sltFruit.options.item(intCurIndex).value    = sltFruit.options.item(intCurIndex + 1).value;
        sltFruit.options.item(intCurIndex).text        = sltFruit.options.item(intCurIndex + 1).text;
        sltFruit.options.item(intCurIndex + 1).value= strTempValue;
        sltFruit.options.item(intCurIndex + 1).text    = strTempText;
        sltFruit.selectedIndex = intCurIndex + 1;
    }
}

function goUp()
{
    var intCurIndex;
    intCurIndex = sltCountry.selectedIndex;

    if (intCurIndex > 0)
        sltCountry.selectedIndex = intCurIndex - 1;
}

function goDown()
{
    var intCurIndex;
    var intIndexCount;
    
    intCurIndex        = sltCountry.selectedIndex;
    intIndexCount    = sltCountry.length;
    
    if (intCurIndex < intIndexCount - 1)
        sltCountry.selectedIndex = intCurIndex + 1;
}
//-->
</script>
</HEAD>

<BODY>

</BODY>
水果列表<BR>
1 - 香蕉<BR>
2 - 苹果<BR>
3 - 葡萄<BR>
4 - 桔子<BR>
5 - 西瓜<BR>
<SELECT SIZE="5">
    <OPTION VALUE="1">香蕉</OPTION>
    <OPTION VALUE="2">苹果</OPTION>
    <OPTION VALUE="3">葡萄</OPTION>
    <OPTION VALUE="4">桔子</OPTION>
    <OPTION VALUE="5">西瓜</OPTION>
</SELECT>

<INPUT TYPE="BUTTON" VALUE="上移">
<INPUT TYPE="BUTTON" VALUE="下移">
<HR>

国家列表<BR>
1 - China<BR>
2 - USA<BR>
3 - USSR<BR>
4 - England<BR>
5 - France<BR>
<SELECT>
    <OPTION VALUE="1">China</OPTION>
    <OPTION VALUE="2">USA</OPTION>
    <OPTION VALUE="3">USSR</OPTION>
    <OPTION VALUE="4">England</OPTION>
    <OPTION VALUE="5">France</OPTION>
</SELECT>

<INPUT TYPE="BUTTON" VALUE="上移">
<INPUT TYPE="BUTTON" VALUE="下移">
</HTML>