关于页面中表单排序显示问题请教？

自己顶一下。还有如果想任意排序的话javascript能控制这样的显示吗？

解决方案 »

  1.   

    <SCRIPT LANGUAGE="JavaScript">
    <!--
    function change()
    {
        var arr = document.all.chk;
        var oTable = document.all.tab;
        var curObj = null;
        for(var i=0; i<arr.length; i++)
            if(arr[i].value == 3)
                curObj = arr[i];
        var firstNode = oTable.rows[0];
        var curNode = curObj.parentNode.parentNode;
        firstNode.swapNode(curNode);
    }
    //-->
    </SCRIPT>
    <form name=formname>
      <table id="tab">
       <tr>
        <td><input type=checkbox name=chk value=1></td><td>name1</td>
       </tr>
       <tr>
        <td><input type=checkbox name=chk value=2></td><td>name2</td>
       </tr>
       <tr>
        <td><input type=checkbox name=chk value=3></td><td>name3</td>
       </tr>
       <tr>
        <td><input type=checkbox name=chk value=4></td><td>name4</td>
       </tr>
      </table><p>
      <INPUT TYPE="button" value=" 交换 " onclick="change()">
    </form>
      

  2.   

    给你一个思路
    先用document.getElementsByTagName("tr").length得到表的行数。
    然后建立一个length大小的数组 myarray，把
    document.getElementsByTagName("tr")[0].innerHTML
    .......
    .......
    document.getElementsByTagName("tr")[length-1].innerHTML
    保存在数组里面。然后根据document.getElementsByTagName("tr")[i].id.value的值
    对数组进行排序。
    然后用var s = getElementsByTagName("table")[0]; 
          document.formname.removeChild(s);
    把表全删掉。
    接下来用var temp = document.createElement("table");          
            for(a=0;a<myarray.length;a++)
            {
               var temptr = document.createElement("tr");          
      temptr.innerHTML=myarray[a];
               temp.appendChild(temptr);
            }
            document.formname.appendChild(temp);
    把表动态的加到form里面就行了
    这个方法就是麻烦了一点。
    期待高手给出更好的方法。
      

  3.   

    <html>
    <head></head>
    <body>
    <table border=3 id="aaa" >
    <tr>
    <td onclick="tbpx()">name</td>
    <td onclick="tbpx()">id</td>
    </tr>
    <tr>
    <td >aaa</td>
    <td>001</td>
    </tr>
    <tr>
    <td >ccc</td>
    <td>009</td>
    </tr>
    <tr>
    <td >ddd</td>
    <td>003</td>
    </tr>
    <tr>
    <td >bbb</td>
    <td>004</td>
    </tr>
    </table>
    <br><br>
    点击表头排序</body>
    <script>
    var zd=true;//正、倒序
    function tbpx()
    {
    var i,j,x;
    var theCell = event.srcElement;
    if (theCell.tagName=="TABLE"){
    return false;
    }
    while (theCell.tagName!="TD"){
    theCell = theCell.parentElement;
    }
    x=theCell.cellIndex;
    var len=aaa.rows.length;
    for(i=1;i<len;i++)
    {
    for(j=i+1;j<len;j++)
    {
    if(zd)
    {if(aaa.rows(i).cells(x).innerHTML>aaa.rows(j).cells(x).innerHTML)
    aaa.rows(i).swapNode(aaa.rows(j));
    }
    else
    {if(aaa.rows(i).cells(x).innerHTML<aaa.rows(j).cells(x).innerHTML)
    aaa.rows(i).swapNode(aaa.rows(j));}
    }
    }
    zd=!zd;
    }
    </script>
    </html>