当前位置: 代码迷 >> J2EE >> 一个有关问题(JSP)
  详细解决方案

一个有关问题(JSP)

热度:59   发布时间:2016-04-22 00:34:29.0
请教大家一个问题(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哈哈 自己的想法是把数据放到数组里 然后遍历下互换位置 但这里会要先把数据组合成字符串 会涉及到遍历之前组装 换位后在拆分 感觉有点繁琐 求好点的方法 请大家不吝赐教 谢谢~~

------解决方案--------------------
用省级关联就可以实现,你可以baidu下省级关联
------解决方案--------------------
为啥不用JS再前台做,这个和JAVAEE有啥关系,你不都写onclick方法了么
------解决方案--------------------
对,就在JS前台做就可以了,先组成4个字符串放到数组里,交换位置后,再拆分,行不行
------解决方案--------------------
干脆弄个时下更流行的一种时间方式,
鼠标按住在第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;
------解决方案--------------------
HTML code
<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>
  相关解决方案