如何利用JS代码实现拖动表格行改变顺序呢？
html xmlns=http://www。w3。org/1999/xhtmlheadmeta http-equiv=Content-Type content=text/html; charset=gb2312 /title拖拽表格的行-学无忧（www。 xue51。com）/titlestyle type=text/csstd{position:relative;}body {margin-left: 1px;margin-top: 1px;margin-right: 1px;margin-bottom: 1px;}/style/headbody style=margin-left:0...全部
html xmlns=http://www。w3。org/1999/xhtmlheadmeta http-equiv=Content-Type content=text/html; charset=gb2312 /title拖拽表格的行-学无忧（www。
xue51。com）/titlestyle type=text/csstd{position:relative;}body {margin-left: 1px;margin-top: 1px;margin-right: 1px;margin-bottom: 1px;}/style/headbody style=margin-left:0px; margin-top:0px;table width=301 border=1 bordercolor=#CCCCCC id=dragTbltr td width=73序号/td td width=52姓名/td td width=65年龄/td td width=83地址/td/trtr td width=731/td td width=52张三/td td width=6522/td td width=83北京海淀/td/tr tr td 2/td td王五/td td24/td td上海浦东/td /tr tr td3/td td朝气/td td24/td td广州深圳/td /tr/tablescript language=javascript var obj;var xx=0,yy=0;var tagobj;var dragobj;function draginit(){var tblRows = document。
getElementsByTagName(TR); //获取所有的表格行for(var i=0;itblRows。length;i++){ //遍历每一行if((tblRows[i]。parentNode。
parentNode。id)。toString()。indexOf(drag)!=-1){tblRows[i]。onmousedown=mousedown; //绑定所有的鼠标事件tblRows[i]。
ondragover=dragover;tblRows[i]。ondragend=dragend;tblRows[i]。ondrag=dragmove;tblRows[i]。style。position=relative;tblRows[i]。
style。zIndex=1;}}}function mousedown(){ //鼠标按下时的处理obj = event。srcElement;if(obj。tagName==TD) obj=obj。
parentNode; //如果是单元格if(obj。tagName!=TR) return false; //如果是单元行if(obj。rowIndex==0) return false; //如果是标题yy=event。
clientY; //鼠标的x坐标和y坐标xx=event。clientX;obj。style。zIndex=0;try{obj。dragDrop();}catch(e){}}function dragmove(){ //表格拖拽移动时的位置获取obj。
style。top = event。clientY-yy;obj。style。left = event。clientX-xx;}function dragover(){ //鼠标拖动时的操作tagobj=event。
srcElement;if(tagobj。tagName==TD){tagobj=tagobj。parentNode;}//如果是单元格if(tagobj。tagName!=TR)return false; //如果是单元行}function dragend(){ //拖拽完毕后的处理-高度，宽度等obj。
style。top=0;obj。style。left=0;obj。style。zIndex=1;if(tagobj!=null tagobj。rowIndex!=0){var t1=dragTbl。
rows[obj。rowIndex];var t2=dragTbl。rows[tagobj。rowIndex];dragTbl。getElementsByTagName('tbody')[0]。
insertBefore(obj,tagobj);//实现表格单元行的互换tagobj。style。zIndex=1;}tagobj=null;}draginit(); //初始化拖拽操作/script/body/html。
收起
