5_1 : 게시판 여분필드와 자바스크립트 : 배열쪼개기(1)
5_1 편은 그냥 php 는 붙이지 않은 채 html 과 js 의 뼈다구 코드만 먼저 올릴게요.
나중에 처리할 때는 wr_5 의 type 을 hidden 으로 주고
뷰페이지에서는 여분필드를 | 으로 explode 해서 사용하면 됩니다.
코드를 째려보면서 이해하셨음 좋겠습니다.
5_2 에서 토탈소스를 짜면서 이 시리즈(?)를 마칠게요.
결과물은 https://wittazzurri.com/editor/html_editor.php 에서 확인하세요.
----------
보내는 코드
[code]
<input id="wr_5" name="wr_5">
<div id="wrDiv_5">
<input value="봄">
<input value="여름">
<input value="가을">
<input value="겨울">
</div>
<button onclick="btnClick()">클릭</button>
<script>
function btnClick() {
for (i of wrDiv_5.querySelectorAll("input")) wr_5.value += (i.value + "|");
wr_5.value = wr_5.value.slice(0, -1);
}
</script>
[/code]
----------
받는 코드
[code]
<input id="wr_5" name="wr_5" value="봄|여름|가을|겨울">
<div id="wrDiv_5">
<input>
<input>
<input>
<input>
</div>
<script>
n = 0;
for (i of wrDiv_5.querySelectorAll("input")) i.value = wr_5.value.split("|")[n++];
</script>
[/code]
댓글 4개
게시판 목록
그누보드5 팁자료실
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 공지 | 3년 전 | 4400 | ||
| 1914 |
welcome
|
4년 전 | 2815 | |
| 1913 | 4년 전 | 3153 | ||
| 1912 | 4년 전 | 3834 | ||
| 1911 | 4년 전 | 4075 | ||
| 1910 |
|
4년 전 | 3321 | |
| 1909 | 4년 전 | 4119 | ||
| 1908 | 4년 전 | 6509 | ||
| 1907 |
D2Bweb
|
4년 전 | 3655 | |
| 1906 |
그누x쵸딩
|
4년 전 | 5076 | |
| 1905 |
그누x쵸딩
|
4년 전 | 2810 | |
| 1904 | 4년 전 | 4776 | ||
| 1903 | 4년 전 | 4242 | ||
| 1902 | 4년 전 | 3277 | ||
| 1901 | 4년 전 | 3776 | ||
| 1900 | 4년 전 | 3218 | ||
| 1899 | 4년 전 | 2990 | ||
| 1898 | 4년 전 | 4136 | ||
| 1897 | 4년 전 | 3291 | ||
| 1896 | 4년 전 | 2828 | ||
| 1895 |
welcome
|
4년 전 | 3061 | |
| 1894 |
welcome
|
4년 전 | 2654 | |
| 1893 | 4년 전 | 4890 | ||
| 1892 | 4년 전 | 4342 | ||
| 1891 |
7일의태양
|
4년 전 | 4448 | |
| 1890 | 4년 전 | 6446 | ||
| 1889 | 4년 전 | 4720 | ||
| 1888 | 4년 전 | 4347 | ||
| 1887 | 4년 전 | 3265 | ||
| 1886 |
슈퍼스타맨
|
4년 전 | 4797 | |
| 1885 | 4년 전 | 3809 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기