테이블의 tr 아래위로 이동
페이지 정보
작성자 서방님 댓글 2건 조회 126회 작성일 07-06-11 09:43본문
<script>
function moveRow()
{
var oTbl = document.getElementById("tbl");
var oRow = oTbl.rows[document.getElementById("nRow").value];
var sDir = document.getElementById("sDir").value;
if (sDir == "up")
{
var nIndex = oRow.rowIndex - 1;
if (nIndex<0)
return;
var oNewRow = oTbl.insertRow(nIndex);
}
else
{
var nIndex = oRow.rowIndex + 2;
if (nIndex>oTbl.rows.length)
return;
var oNewRow = oTbl.insertRow(nIndex);
}
for (i=0;i<oRow.childNodes.length;i++)
{
var oCell = oNewRow.insertCell();
oCell.innerHTML = oRow.childNodes[i].innerHTML;
}
oRow.removeNode(true);
}
</script>
<table border="1" cellpadding="0" cellspacing="0" id="tbl" width="100">
<tr>
<td>1</td>
</tr>
<tr>
<td>2</td>
</tr>
<tr>
<td>3</td>
</tr>
</table>
<select id="nRow">
<option value="0">첫번째 줄을
<option value="1">두번째 줄을
<option value="2">세번째 줄을
</select>
<select id="sDir">
<option value="up">위로
<option value="dn">아래로
</select>
<button onclick="moveRow()">이동</button>
댓글목록
서방님님의 댓글
서방님 작성일
<P><html><BR><script><BR>nowselect = null;<BR>function selectcell(no){<BR>if(nowselect != null) document.getElementById("cell_"+nowselect).style.backgroundColor='';<BR>nowselect = no;<BR>document.getElementById("cell_"+nowselect).style.backgroundColor='#f0f0f0';<BR>}</P>
<P>function movecell(flag){<BR>if(nowselect!=null){<BR>cell = (flag == 1)? nowselect-1 : nowselect+1;<BR>cell_html = document.getElementById("cell_"+cell).innerHTML;<BR>document.getElementById("cell_"+cell).innerHTML = document.getElementById("cell_"+nowselect).innerHTML;<BR>document.getElementById("cell_"+nowselect).innerHTML = cell_html;<BR>selectcell(cell);<BR>}else alert('셀을 선택하세요');<BR>}<BR></script></P>
<P><table><BR> <tr><BR> <td id="cell_1" onclick="selectcell(1);">1 옮겨져라</td><BR> </tr><BR> <tr><BR> <td id="cell_2" onclick="selectcell(2);">2 잘되련지는 의문</td><BR> </tr><BR> <tr><BR> <td id="cell_3" onclick="selectcell(3);">3 아하하하</td><BR> </tr><BR></table><a href="javascript:void(0);" onclick="movecell(1);">위로</a><BR><br> <a href="javascript:void(0);" onclick="movecell(2);">아래로</a><BR></P>
서방님님의 댓글
서방님 작성일
<P><script><BR>function moveRow()<BR>{</P>
<P> var oTbl = document.getElementById("tbl");<BR> var nIdx = document.getElementById("nRow").value;<BR> var oRow = oTbl.rows[nIdx];<BR> var sDir = document.getElementById("sDir").value;</P>
<P> if (sDir == "up")<BR> {<BR> var nIndex = oRow.rowIndex - 1;<BR> if (nIndex<0)<BR> return;<BR> var oNewRow = oTbl.insertRow(nIndex);<BR> }<BR> else<BR> {<BR> var nIndex = oRow.rowIndex + 2;<BR> if (nIndex>oTbl.rows.length)<BR> return;<BR> var oNewRow = oTbl.insertRow(nIndex);<BR> }</P>
<P> for (i=0;i<oRow.childNodes.length;i++)<BR> {<BR> if (oRow.childNodes[i].tagName=="TD")<BR> {<BR> var oCell = document.createElement("TD");<BR> oNewRow.appendChild(oCell);<BR> oCell.innerHTML = oRow.childNodes[i].innerHTML;<BR> }<BR> }<BR> var n = (sDir=="up")?parseInt(nIdx)+1:parseInt(nIdx);<BR> oTbl.deleteRow(n);</P>
<P>}<BR></script></P>
<P><table border="1" cellpadding="0" cellspacing="0" id="tbl" width="100"><BR> <tr><BR> <td>1</td><BR> <td>1</td><BR> </tr><BR> <tr><BR> <td>2</td><BR> <td>2</td><BR> </tr><BR> <tr><BR> <td>3</td><BR> <td>3</td><BR> </tr><BR></table></P>
<P><select id="nRow"><BR> <option value="0">첫번째 줄을<BR> <option value="1">두번째 줄을<BR> <option value="2">세번째 줄을<BR></select></P>
<P><select id="sDir"><BR> <option value="up">위로<BR> <option value="dn">아래로<BR></select></P>
<P><button onclick="moveRow()">이동</button><BR></P>
