2026, 새로운 도약을 시작합니다.

다중(2중) 셀렉트 박스 질문 드립니다. 채택완료

구글링 하다 얻어건진 2단 셀렉트박스 입니다. html 에서는 잘 되는데 보시면 아시겠지만

2단 셀렉트박스는 저장하는 부분이 없습니다.;;

어떻게 처리를 해야될까요? 많은 도움이 필요합니다.ㅠㅠ

1단 셀렉트 박스(wr_4에 저장됨)

Copy




            참가부문

            

                참가부문

                >청소년(잔여팀 - 팀)

                

2단 셀텍트박스(wr_5에 저장할 예정....)

Copy




            신청 도서명

            

                신청할 도서를 선택하세요

            

            

            

            function categoryChange(e) {

                var book_a = ["신청할 도서를 선택하세요", "최숙희_네 기분은 어떤 색깔이니?", "권영세_동백나무가 웃다", "김상삼_약밤나무의 백 년 이야기"];

                var book_b = ["신청할 도서를 선택하세요", "김수빈_고요한 우연", "김선미_비스킷", "지혜_읽고 쓰고 내가 됩니다"];

                var book_c = ["신청할 도서를 선택하세요", "이슬아_가녀장의 시대", "김익한_거인의 노트", "박창원_오늘 보는 그제 뉴-쓰", "김혜진_툭복을 비는 마음"];

                var target = document.getElementById("book");

                if(e.value == "어린이") var d = book_a;

                else if(e.value == "청소년") var d = book_b;

                else if(e.value == "성인") var d = book_c;

                target.options.length = 0;

                for (x in d) {

                    var opt = document.createElement("option");

                    opt.value = d[x];

                    opt.innerHTML = d[x];

                    target.appendChild(opt);

                }

            }

            

        

답변 1개

채택된 답변
+20 포인트

아래의 코드를 한번 참고를 해보시겠어요..

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Multi-select box example</title>
</head>
<body>
    <form method="post" action="your_save_script.php">
        <div class="write_div">
            <label for="wr_4" class="sound_only">참가부문</label>
            <select id="wr_4" name="wr_4" class="frm_input full_input required" onchange="categoryChange(this)">
                <option value="">참가부문</option>
                <option value="어린이">어린이(잔여팀 - 5팀)</option>
                <option value="청소년">청소년(잔여팀 - 3팀)</option>
                <option value="성인">성인(잔여팀 - 2팀)</option>
            </select>
        </div>

        <div class="write_div">
            <label for="wr_5" class="sound_only">신청 도서명</label>
            <select name="wr_5" id="book" class="frm_input full_input required">
                <option>신청할 도서를 선택하세요</option>
            </select>
        </div>
        
        <button type="submit">저장하기</button>
    </form>
    
    <script>
        function categoryChange(e) {
            var book_a = ["신청할 도서를 선택하세요", "최숙희_네 기분은 어떤 색깔이니?", "권영세_동백나무가 웃다", "김상삼_약밤나무의 백 년 이야기"];
            var book_b = ["신청할 도서를 선택하세요", "김수빈_고요한 우연", "김선미_비스킷", "지혜_읽고 쓰고 내가 됩니다"];
            var book_c = ["신청할 도서를 선택하세요", "이슬아_가녀장의 시대", "김익한_거인의 노트", "박창원_오늘 보는 그제 뉴-쓰", "김혜진_툭복을 비는 마음"];
            var target = document.getElementById("book");
            var d = [];

            if(e.value == "어린이") d = book_a;
            else if(e.value == "청소년") d = book_b;
            else if(e.value == "성인") d = book_c;

            target.options.length = 0;
            for (var i = 0; i < d.length; i++) {
                var opt = document.createElement("option");
                opt.value = d[i];
                opt.innerHTML = d[i];
                target.appendChild(opt);
            }
        }
    </script>
</body>
</html>

로그인 후 평가할 수 있습니다

답변에 대한 댓글 2개

엇.. 저장까진 잘 됩니다. 근데, 저장된 걸 다시 가져오려면 어딜 손 봐야 할까요?
해결 했습니다~~ 감사합니다!!!

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

답변을 작성하려면 로그인이 필요합니다.

로그인
🐛 버그신고