请教大家一个问题（JSP）

 我碰到的问题如下：
  
   一个JSP页面有个table  table里面数据格式如下：
    
      单选框1    数据1    数据2   数据3     
    
      单选框2    数据4    数据5   数据6      单选框3     数据7   数据8    数据9      单选框4     数据10   数据11  数据12
                            <input type="button" value="提升优先级" onclick="do()">  我现在想做的动作是  我选中一个单选框 比如 单选框3 然后点击 提升优先级 这个按钮  把单选框3对应的这行数据上移
  到 单选框2这个位置  然后单选框2对应的这行数据就会下移到 单选框3这个位置  请问大牛们 这个逻辑在JS里面应该怎
  么实现 ？  我刚接触J2EE哈哈 自己的想法是把数据放到数组里 然后遍历下互换位置 但这里会要先把数据组合成字符串 会涉及到遍历之前组装 换位后在拆分 感觉有点繁琐  求好点的方法 请大家不吝赐教 谢谢~~  

解决方案 »

  1.   

    用省级关联就可以实现，你可以baidu下省级关联
      

  2.   

    为啥不用JS再前台做，这个和JAVAEE有啥关系，你不都写onclick方法了么
      

  3.   

    <tr id='tr1'>
    <td>单选框1</td> <td>数据1</td>  
    <tr/>    
    <tr id='tr2'>
    <td>单选框2</td> <td>数据2</td>  
    <tr/> var tr1 = document.getElementById("tr1");
    var tr2 = document.getElementById("tr2");
    var tr1Str = tr1.innerHTML;
    var tr2Str = tr2.innerHTML;
    tr1.innerHTML = tr2Str;
    tr2.innerHTML = tr1Str;
      

  4.   


    <html>
    <head>
    <title>这种方式支持任何浏览器</title>
    <script>
    function swapTR(action){
    var oSelIpt = null;
    var iptArr = document.getElementsByTagName('input');
    for(var i=0,len=iptArr.length;i<len;i++){
    if(iptArr[i].checked){
    oSelIpt = iptArr[i];
    break;
    }
    } if(!oSelIpt) return; var _row = oSelIpt.parentNode.parentNode; if(action==0) //上移
    {
    if(_row.previousSibling)//如果不是第一行
    swapNode(_row, _row.previousSibling);
    }else{
    if(_row.nextSibling)
    swapNode(_row, _row.nextSibling);
    } //保证换行后单选框选中ie中
    oSelIpt.checked = true
    } function swapNode(node1, node2){
    var _parent = node1.parentNode; //获取两个结点的相对位置
    var _t1 = node1.nextSibling;
    var _t2 = node2.nextSibling; //将node2插入到原来node1的位置
    if(_t1) _parent.insertBefore(node2, _t1);
    else _parent.appendChild(node2); //将node1插入到原来node2的位置
    if(_t2)_parent.insertBefore(node1,_t2);
    else _parent.appendChild(node1);
    } function cleanWhitespace(element) {
    for(var row = element.rows[0]; row; row = row.nextSibling){
    if(row.nodeType==3){
    var _row;
    if(!row.previousSibling)
    _row = row.nextSibling;
    else
    _row = row.previousSibling;
    row.parentNode.removeChild(row);
    row = _row;
    }
    }
    }
    window.onload = function(){
    cleanWhitespace(document.getElementById('tab_test'));  //火狐的tr间会有textnode节点，把他们都移除掉
    }
    </script>
    </head>
    <body>
    <table id="tab_test">
    <tr>
    <td><input type='radio' name='row' checked /></td><td>1 </td><td>1 </td><td>1 </td>
    </tr>
    <tr>
    <td><input type='radio' name='row' /></td><td>2 </td><td>2 </td><td>2 </td>
    </tr>
    <tr>
    <td><input type='radio' name='row' /></td><td>3 </td><td>3 </td><td>3 </td>
    </tr>
    <tr>
    <td><input type='radio' name='row' /></td><td>4 </td><td>4 </td><td>4 </td>
    </tr>
    </table><button onclick='swapTR(0)' >上移</button>
    <button onclick='swapTR(1)' >下移</button>
    </body>
    </html>
    根据你的要求，现写的，楼主 给分吧ie firefox chrome 都测试了
      

  5.   

    <html>
    <head>
    <style type="text/css">
    table {
       border: 1px solid #CCC;
       border-collapse:collapse;
    }
    tr {
       border: 1px solid #CCC;
       border-collapse:collapse;
    }
    </style>
    <script>
    function upgrade() 
    {
    var radios=document.getElementsByTagName("input");
    var checkedRadio=null;
    for(var i=1,len=radios.length;i<len;i++){
    if(radios[i].checked){
    checkedRadio = radios[i];
    break;
    }
    }
    // checkedRadio.checked=true;

    var row=checkedRadio.parentNode.parentNode;

    var parent=row.parentNode;
    var insertedNode=row;
    var baseNode=row.previousSibling;

    // 
    if(insertedNode.nextSibling)
    {
    parent.insertBefore(baseNode, insertedNode);
    }else {
    arent.appendChild(baseNode);
    }

    // 
    if(baseNode.nextSibling)
    {
    parent.insertBefore(insertedNode, baseNode);
    }else {
    arent.appendChild(insertedNode);
    }
    checkedRadio.checked=true;
    }
    </script>
    </head>
    <body>
    <table align="center" border="1" width="50%">
    <tr>
    <td>
    <input type="radio" id="test11" name="test11" checked/>test1
    </td>
    <td>1</td>
    <td>1</td>
    <td>1</td>
    <tr/>
    <tr>
    <td>
    <input type="radio" id="test11" name="test11" />test2
    </td>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <tr/>
    <tr>
    <td>
    <input type="radio" id="test11" name="test11" />test3
    </td>
    <td>3</td>
    <td>3</td>
    <td>3</td>
    <tr/>
    <tr>
    <td>
    <input type="radio" id="test11" name="test11" />test4
    </td>
    <td>4</td>
    <td>4</td>
    <td>4</td>
    <tr/>
    </table>
    <div align="center"><button onclick="upgrade()">upgrade</button></div>
    </body>
    </html>