关于select问题

http://fason.nease.net/samples/js/moveoptions.html

解决方案 »

  1.   

    取得选中的index值,根据向上和向下的不同,获得index+1和index-1的位置的值,进行互换即可要注意在第一位置和最后位置时,分别不能进行向上和向下操作!
      

  2.   

    <script language=javascript>
    function moveup(obj)
    {
        if (obj.selectedIndex>0)
        {
            var ttext,tvalue;        ttext=obj.options[obj.selectedIndex].text;
            tvalue=obj.options[obj.selectedIndex].value;        obj.options[obj.selectedIndex].text=obj.options[obj.selectedIndex-1].text;
            obj.options[obj.selectedIndex].value=obj.options[obj.selectedIndex-1].value;
            
            obj.options[obj.selectedIndex-1].text=ttext;
            obj.options[obj.selectedIndex-1].value=tvalue;
            obj.options[obj.selectedIndex-1].selected=true;
        }
    }function movedown(obj)
    {
        if (obj.selectedIndex>=0 && obj.selectedIndex+1<obj.options.length)
        {
            var ttext,tvalue;        ttext=obj.options[obj.selectedIndex].text;
            tvalue=obj.options[obj.selectedIndex].value;        obj.options[obj.selectedIndex].text=obj.options[obj.selectedIndex+1].text;
            obj.options[obj.selectedIndex].value=obj.options[obj.selectedIndex+1].value;
            
            obj.options[obj.selectedIndex+1].text=ttext;
            obj.options[obj.selectedIndex+1].value=tvalue;
            obj.options[obj.selectedIndex+1].selected=true;
        }
    }
    </script><form name=form1><select name="sel1" size="6">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
    </select><input type=button value="上移" onclick="moveup(sel1)">
    <input type=button value="下移" onclick="movedown(sel1)"></form>
      

  3.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
    <title> New Document </title>
    <meta name="Generator" content="EditPlus">
    <meta name="Author" content="">
    <meta name="Keywords" content="">
    <meta name="Description" content="">
    </head><body>
    <script>
    function up()
    {
    var s_obj=document.getElementsByName('oSelect')[0]
    var s_no=document.getElementsByName('oSelect')[0].selectedIndex
    if(event.srcElement.innerText=='上'&&s_no>0&&s_no!=s_obj.length-1)
    {
     var tmp1=s_obj.options(s_no-1).text,tmp2=s_obj.options(s_no-1).value
     s_obj.options[s_no-1]=new Option(s_obj.options(s_no).text,s_obj.options(s_no).value)
         s_obj.options[s_no]=new Option(tmp1,tmp2)
     s_obj.options[s_no-1].selected=true
        
        }}
    function down()
    {
    var s_obj=document.getElementsByName('oSelect')[0]
    var s_no=document.getElementsByName('oSelect')[0].selectedIndex
    if(event.srcElement.innerText=='下'&&s_no>0&&s_no!=s_obj.length-1)
    {
     var tmp1=s_obj.options(s_no+1).text,tmp2=s_obj.options(s_no+1).value
     s_obj.options[s_no+1]=new Option(s_obj.options(s_no).text,s_obj.options(s_no).value)
         s_obj.options[s_no]=new Option(tmp1,tmp2)
         s_obj.options[s_no+1].selected=true
        }}
    </script>
    <form>
    <select name="oSelect" size=5>
    <option value=1 >aaa</option>
    <option value=2>bbb</option>
    <option value=3>ccc</option>
    <option value=4>ddd</option>
    <option value=5>eee</option>
    </select>
    <button onclick="up()">上</button>
    <button onclick="down()">下</button>
    </form></body>
    </html>