옵션에 사용하기 위해 만들어본 코드입니다.
테스트 해본 코드이므로 별 이상은 없을것 같습니다.
동적테이블 정보가 필요하신 분들은 참고하세요.
IE, FF, 크롬에서 실행되는 것을 확이하였습니다.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY>
<form method=post action="a2_post.php">
<input type=button value="행추가" onclick="add_tr();">
<input type=button value="열추가" onclick="add_td();">
<input type=button value="행삭제" onclick="del_row();">
<input type=button value="열삭제" onclick="del_col();">
<table id='tbl' border=1>
<thead id='thd'>
<tr>
<td>
<input type=text name=opty size=4>
<input type=text name=optx size=4>
</td>
<td>
<input type=text name='optx_subj[]' size=10>
</td>
</tr>
</thead>
<tbody id='tbd'>
<tr>
<td><input type=text name='opty_subj[]' size=10></td>
<td><input type=text name='opt[][]' size=10></td>
</tr>
</tbody>
</table>
<input type=submit>
</form>
<span id=msg></span>
<script>
var tbl = document.getElementById('tbl');
var thd = document.getElementById('thd');
var tbd = document.getElementById('tbd');
var tr = null;
var td = null;
var x=1, y=1;
function add_tr()
{
// 행 제목 추가
tr = document.createElement('tr');
tbd.appendChild(tr);
td = document.createElement('td');
tr.appendChild(td);
add_input('opty_subj[]');
// 열의 갯수에 따라 추가된 행의 열 추가
var thd_td = thd.getElementsByTagName('td');
for (i=0; i<thd_td.length-1; i++)
{
td = document.createElement('td');
tr.appendChild(td);
add_input('opt[][]');
}
}
function add_td()
{
// 열 제목 추가
var thd_tr = thd.getElementsByTagName('tr');
td = document.createElement('td');
thd_tr[0].appendChild(td);
add_input('optx_subj[]');
var tbd_tr = tbd.getElementsByTagName('tr');
for (i=0; i<tbd_tr.length; i++) {
//var td_tag = tr_tag[i].getElementsByTagName("td");
td = document.createElement('td');
tbd_tr[i].appendChild(td);
add_input('opt[][]');
}
}
function add_input(name)
{
var inp = document.createElement('input');
inp.setAttribute('type', 'text');
inp.setAttribute('size', '10');
inp.setAttribute('name', name);
td.appendChild(inp);
}
function del_row()
{
var tbd_tr = tbd.getElementsByTagName('tr');
//document.getElementById('msg').innerHTML = tbd_tr.length;
if (tbd_tr.length > 1)
tbd.deleteRow(tbd_tr.length-1);
}
function del_col()
{
var thd_tr = thd.getElementsByTagName('tr');
var thd_td = thd.getElementsByTagName('td');
//document.getElementById('msg').innerHTML = thd_td.length;
if (thd_td.length > 2) {
thd_tr[0].deleteCell(thd_td.length-1);
var tbd_tr = tbd.getElementsByTagName('tr');
for (i=0; i<tbd_tr.length; i++) {
var tr_td = tbd_tr[i].getElementsByTagName('td');
tbd_tr[i].deleteCell(tr_td.length-1);
}
}
}
</script>
</BODY>
</HTML>
게시판 목록
프로그램
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 2330 | 16년 전 | 5069 | ||
| 2329 | 16년 전 | 2304 | ||
| 2328 | 16년 전 | 3404 | ||
| 2327 | 16년 전 | 2639 | ||
| 2326 | 16년 전 | 1554 | ||
| 2325 | 16년 전 | 5347 | ||
| 2324 | 16년 전 | 2464 | ||
| 2323 | 16년 전 | 5958 | ||
| 2322 | 16년 전 | 1936 | ||
| 2321 | 16년 전 | 4018 | ||
| 2320 | 16년 전 | 3025 | ||
| 2319 |
|
16년 전 | 2210 | |
| 2318 |
데니크레인
|
16년 전 | 2232 | |
| 2317 | 16년 전 | 4409 | ||
| 2316 | 16년 전 | 3290 | ||
| 2315 | 16년 전 | 2829 | ||
| 2314 | 16년 전 | 2957 | ||
| 2313 | 16년 전 | 2074 | ||
| 2312 | 16년 전 | 1761 | ||
| 2311 | 16년 전 | 1675 | ||
| 2310 | 16년 전 | 1394 | ||
| 2309 | 16년 전 | 1666 | ||
| 2308 | 16년 전 | 1902 | ||
| 2307 | 16년 전 | 1596 | ||
| 2306 |
|
16년 전 | 4845 | |
| 2305 | 16년 전 | 3821 | ||
| 2304 | 16년 전 | 1785 | ||
| 2303 | 16년 전 | 1525 | ||
| 2302 | 16년 전 | 2264 | ||
| 2301 | 16년 전 | 4528 | ||
| 2300 | 16년 전 | 3541 | ||
| 2299 | 16년 전 | 2574 | ||
| 2298 | 16년 전 | 4328 | ||
| 2297 | 16년 전 | 3200 | ||
| 2296 | 16년 전 | 1351 | ||
| 2295 |
|
16년 전 | 1373 | |
| 2294 |
|
16년 전 | 2035 | |
| 2293 | 16년 전 | 1881 | ||
| 2292 | 16년 전 | 2557 | ||
| 2291 | 16년 전 | 2230 | ||
| 2290 | 16년 전 | 1363 | ||
| 2289 | 16년 전 | 4391 | ||
| 2288 | 16년 전 | 1472 | ||
| 2287 | 16년 전 | 1778 | ||
| 2286 | 16년 전 | 2198 | ||
| 2285 |
|
16년 전 | 3832 | |
| 2284 |
|
16년 전 | 2728 | |
| 2283 |
|
16년 전 | 1483 | |
| 2282 | 16년 전 | 4010 | ||
| 2281 |
|
16년 전 | 1390 | |
| 2280 | 16년 전 | 1574 | ||
| 2279 | 16년 전 | 1234 | ||
| 2278 | 16년 전 | 1710 | ||
| 2277 | 16년 전 | 1610 | ||
| 2276 | 16년 전 | 1622 | ||
| 2275 | 16년 전 | 1422 | ||
| 2274 | 16년 전 | 2179 | ||
| 2273 | 16년 전 | 1814 | ||
| 2272 |
|
16년 전 | 1960 | |
| 2271 | 16년 전 | 2176 | ||
| 2270 |
a1system
|
16년 전 | 1466 | |
| 2269 | 16년 전 | 2303 | ||
| 2268 | 16년 전 | 2253 | ||
| 2267 | 16년 전 | 4525 | ||
| 2266 |
|
16년 전 | 1293 | |
| 2265 | 16년 전 | 1045 | ||
| 2264 |
잠자리똥꾸멍
|
16년 전 | 2007 | |
| 2263 |
태양의서쪽
|
16년 전 | 1970 | |
| 2262 |
태양의서쪽
|
16년 전 | 1510 | |
| 2261 |
태양의서쪽
|
16년 전 | 2036 | |
| 2260 |
|
16년 전 | 2269 | |
| 2259 | 16년 전 | 1381 | ||
| 2258 | 16년 전 | 1734 | ||
| 2257 | 16년 전 | 1921 | ||
| 2256 | 16년 전 | 1008 | ||
| 2255 | 16년 전 | 1686 | ||
| 2254 | 16년 전 | 1402 | ||
| 2253 | 16년 전 | 1905 | ||
| 2252 |
freedays
|
16년 전 | 1321 | |
| 2251 | 16년 전 | 2197 | ||
| 2250 | 16년 전 | 1878 | ||
| 2249 | 16년 전 | 5861 | ||
| 2248 | 16년 전 | 1909 | ||
| 2247 | 16년 전 | 3681 | ||
| 2246 | 16년 전 | 1465 | ||
| 2245 |
|
16년 전 | 1752 | |
| 2244 |
|
16년 전 | 2068 | |
| 2243 | 16년 전 | 2608 | ||
| 2242 | 16년 전 | 2303 | ||
| 2241 | 16년 전 | 2753 | ||
| 2240 | 16년 전 | 2987 | ||
| 2239 | 16년 전 | 3009 | ||
| 2238 |
|
16년 전 | 1817 | |
| 2237 |
|
16년 전 | 1536 | |
| 2236 |
|
16년 전 | 1409 | |
| 2235 | 16년 전 | 1723 | ||
| 2234 | 16년 전 | 1203 | ||
| 2233 | 16년 전 | 1959 | ||
| 2232 |
|
16년 전 | 1731 | |
| 2231 | 16년 전 | 1605 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기