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년 전 | 4402 | ||
| 1944 | 4년 전 | 2867 | ||
| 1943 | 4년 전 | 2395 | ||
| 1942 | 4년 전 | 2726 | ||
| 1941 | 4년 전 | 4327 | ||
| 1940 | 4년 전 | 3964 | ||
| 1939 |
|
4년 전 | 4253 | |
| 1938 | 4년 전 | 3504 | ||
| 1937 |
Aro컴퍼니
|
4년 전 | 3928 | |
| 1936 |
슈퍼스타맨
|
4년 전 | 3231 | |
| 1935 | 4년 전 | 4118 | ||
| 1934 |
|
4년 전 | 5782 | |
| 1933 | 4년 전 | 4523 | ||
| 1932 |
|
4년 전 | 4379 | |
| 1931 |
|
4년 전 | 3432 | |
| 1930 | 4년 전 | 2912 | ||
| 1929 |
|
4년 전 | 3778 | |
| 1928 | 4년 전 | 3590 | ||
| 1927 | 4년 전 | 4139 | ||
| 1926 |
dev2lgb
|
4년 전 | 3445 | |
| 1925 | 4년 전 | 4803 | ||
| 1924 |
Aro컴퍼니
|
4년 전 | 5233 | |
| 1923 |
그누x쵸딩
|
4년 전 | 3763 | |
| 1922 |
|
4년 전 | 2893 | |
| 1921 | 4년 전 | 3347 | ||
| 1920 |
Aro컴퍼니
|
4년 전 | 3920 | |
| 1919 |
그누x쵸딩
|
4년 전 | 2469 | |
| 1918 | 4년 전 | 4482 | ||
| 1917 |
Aro컴퍼니
|
4년 전 | 3636 | |
| 1916 | 4년 전 | 4268 | ||
| 1915 |
Aro컴퍼니
|
4년 전 | 3069 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기