본문 바로가기
JQUERY/JQUERY 이용한 동적 테이블 변경

JQUERY 이용한 동적 테이블 변경

by 정윤재 2011. 2. 5.


완벽하게 JQUERY 를 이용하지는 못했지만 코드가 많이 줄어들긴 했다.

우선 그 정도로 만족해야 할 것 같다.

JQUERY를 사용하는 이유가 코딩을 줄이기 위해서 일테니까

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
<script src="./js/jquery-1.4.4.min.js"></script>
<script>
function add(){
 
 $("#addtbl").after("<tr onmouseover=\"changeTbl.clickedRowIndex=this.rowIndex\"><td>ccc</td><td>ddd<input type='button' value='삭제'  onclick=\"del()\"'></td></tr>");
 
}
function del(){
 var tbl =document.getElementById("changeTbl");
 tbl.deleteRow(tbl.clickedRowIndex);
}
</script>
</head>
<body>
<form name="f">
 <table border="1" id="changeTbl">
  <tr id="addtbl">
   <td>aaaa</td>
   <td><input type="button" onclick="add()" value="추가"></td>
  </tr>
 </table>
</form>
</body>
</html>

댓글