테스트 사이트 - 개발 중인 베타 버전입니다

4. 게시판 여분필드와 자바스크립트 : select

· 2년 전 · 2034 · 11

먼저 3편까지 이해를 하셔야 합니다.

 

1편 - https://sir.kr/g5_tip/20120
2편 - https://sir.kr/g5_tip/20129
3편 - https://sir.kr/g5_tip/20147

 

----------

 

셀렉트를 사용할 때는 보통 아래처럼 사용합니다.

 

[code]

<select id="wr_4" name="wr_4">
    <option value="">선택하세요</option>
    <option value="봄"<?php echo ($write['wr_4'] == "봄") ? " selected" : "";?>>봄</option>
    <option value="여름"<?php echo ($write['wr_4'] == "여름") ? " selected" : "";?>>여름</option>
    <option value="가을"<?php echo ($write['wr_4'] == "가을") ? " selected" : "";?>>가을</option>
    <option value="겨울"<?php echo ($write['wr_4'] == "겨울") ? " selected" : "";?>>겨울</option>
</select>

[/code]

 

----------

 

셀렉트는 자바스크립트가 코드도 훨 간명합니다.

 

[code]

<select id="wr_4" name="wr_4">
    <option style="display:none" value="">선택하세요</option>
    <option>봄</option>
    <option>여름</option>
    <option>가을</option>
    <option>겨울</option>
</select>

.

.

.

<script>wr_4.value = "<?php echo $write['wr_4']; ?>";</script>

[/code]

 

----------

 

write.skin.php 를 건드리지 않고 pc basic 스킨의 write.tail.skin.php 에서 표현하려면 아래처럼요

 

[code]

<script>
wrSelect_4 = `
    <select id="wr_4" name="wr_4">
        <option style="display:none" value="">선택하세요</option>
        <option>봄</option>
        <option>여름</option>
        <option>가을</option>
        <option>겨울</option>
    </select>
`;
document.querySelector("#bo_w .bo_w_tit").insertAdjacentHTML("afterend", wrSelect_4);
wr_4.value = "<?php echo $write['wr_4']; ?>";
</script>

[/code]

 

31845957_1678944302.5782.jpg

 

위와 같이 만들어집니다.

다음에는 마지막으로 name="wr_5[]" 를 주지 않고 name="wr_5" 만 주면서 배열로 쪼개는 방법을 소개하겠습니다. 

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 11개

2년 전
좋은자료 감사합니다

게시글 목록

번호 제목
20497
20496
20467
20455
20448
20447
20446
20428
20424
20421
20404
20402
20401
20389
20350
20345
20333
20307
20286
20284
20281
20280
20239
20235
20226
20197
20192
20189
20166
20147