자바스크립트 질문입니다 ㅜㅜ

자바스크립트 질문입니다 ㅜㅜ

QA

자바스크립트 질문입니다 ㅜㅜ

본문

첫번째 자바스크립트를 두개 쓰려고하는데...

바꿔바도 작동을 하지 않네요 ㅠㅠ

틀린게 있나요? ㅠㅜ

 


<select id="sel_one" onchange="com_child();"  name="wr_4" style="display: inline-block;width:40%" required></select>
                    
<select id="sel_two"  name="wr_5"  style="display: inline-block;width:40%" required></select>
    <script>
    let parents =[
        {v:"",m:"일자선택"},
        {v:"9월 8일",m:"9월 8일"},  //m :셀렉트박스 노출값, v: 저정될값
        {v:"9월 11일",m:"9월 11일"},     
        ];
    //m :셀렉트박스 노출값, v: 저정될값
    let child1 =[{v:"08:45 퀸메리2",m:"08:45 퀸메리2"},{v:"16:45 퀸메리2",m:"16:45 퀸메리2"},]; 
    let child2 =[{v:"08:45 퀸메리2",m:"08:45 퀸메리2"},{v:"16:45 퀸메리2",m:"16:45 퀸메리2"},];
   
    function com_parent(){
        let opt = [];
        parents.forEach(data =>{
            opt.push(`<option value="${data.v}">${data.m}</option>`);
        });
        document.getElementById("sel_one").innerHTML = opt.join("");
    }
    
    
    function com_child(){
        let opt = [];
        let oneSel = document.getElementById("sel_one").value;
        
        console.log(oneSel);
        if( oneSel == ""){
        }else {
            if( oneSel == "9월 8일"){
                child1.forEach(data =>{
                    opt.push(`<option value="${data.v}">${data.m}</option>`);
                });
            }else if( oneSel == "9월 11일"){
                child2.forEach(data =>{
                    opt.push(`<option value="${data.v}">${data.m}</option>`);
                });  
        
            }
        }
        document.getElementById("sel_two").innerHTML = opt.join("");
    }
    com_parent();
<!-- 두번째 -->
<select id="sel_one2" onchange="com_child2();"  name="wr_4" style="display: inline-block;width:40%" required></select>
                    
<select id="sel_two2"  name="wr_5"  style="display: inline-block;width:40%" required></select>
    <script>
    let parents2 =[
        {v:"",m:"일자선택"},
        {v:"9월 8일",m:"9월 8일"},  //m :셀렉트박스 노출값, v: 저정될값
        {v:"9월 11일",m:"9월 11일"},     
        ];
    //m :셀렉트박스 노출값, v: 저정될값
    let child3 =[{v:"08:45 퀸메리2",m:"08:45 퀸메리2"},{v:"16:45 퀸메리2",m:"16:45 퀸메리2"},]; 
    let child4 =[{v:"08:45 퀸메리2",m:"08:45 퀸메리2"},{v:"16:45 퀸메리2",m:"16:45 퀸메리2"},];
   
    function com_parent2(){
        let opt2 = [];
        parents2.forEach(data =>{
            opt2.push(`<option value="${data.v}">${data.m}</option>`);
        });
        document.getElementById("sel_one2").innerHTML = opt2.join("");
    }
    
    
    function com_child2(){
        let opt2 = [];
        let oneSel2 = document.getElementById("sel_one2").value;
        
        console.log(oneSel2);
        if( oneSel2 == ""){
        }else {
            if( oneSel2 == "9월 8일"){
                child3.forEach(data =>{
                    opt2.push(`<option value="${data.v}">${data.m}</option>`);
                });
            }else if( oneSel2 == "9월 11일"){
                child4.forEach(data =>{
                    opt2.push(`<option value="${data.v}">${data.m}</option>`);
                });  
        
            }
        }
        document.getElementById("sel_two2").innerHTML = opt2.join("");
    }
    com_parent2();
    </script>

 

 

변경한 내용 색칠~

<!-- 두번째 -->

<select id="sel_one2" onchange="com_child2();"  name="wr_4" style="display: inline-block;width:40%" required></select>
                    
<select id="sel_two2"  name="wr_5"  style="display: inline-block;width:40%" required></select>

    <script>
    let parents2 =[
        {v:"",m:"일자선택"},
        {v:"9월 8일",m:"9월 8일"},  //m :셀렉트박스 노출값, v: 저정될값
        {v:"9월 11일",m:"9월 11일"},     

        ];
    //m :셀렉트박스 노출값, v: 저정될값
    let child3 =[{v:"08:45 퀸메리2",m:"08:45 퀸메리2"},{v:"16:45 퀸메리2",m:"16:45 퀸메리2"},]; 
    let child4 =[{v:"08:45 퀸메리2",m:"08:45 퀸메리2"},{v:"16:45 퀸메리2",m:"16:45 퀸메리2"},];
   

    function com_parent2(){
        let opt2 = [];
        parents2.forEach(data =>{
            opt2.push(`<option value="${data.v}">${data.m}</option>`);
        });
        document.getElementById("sel_one2").innerHTML = opt2.join("");
    }
    
    
    function com_child2(){
        let opt2 = [];
        let oneSel2 = document.getElementById("sel_one2").value;
        
        console.log(oneSel2);
        if( oneSel2 == ""){
        }else {
            if( oneSel2 == "9월 8일"){
                child3.forEach(data =>{
                    opt2.push(`<option value="${data.v}">${data.m}</option>`);
                });
            }else if( oneSel2 == "9월 11일"){
                child4.forEach(data =>{
                    opt2.push(`<option value="${data.v}">${data.m}</option>`);
                });  

        
            }
        }
        document.getElementById("sel_two2").innerHTML = opt2.join("");
    }
    com_parent2();

이 질문에 댓글 쓰기 :

답변 3


<select id="sel_one" onchange="com_child();" name="wr_4" style="display: inline-block;width:40%" required></select>
                    
<select id="sel_two" name="wr_5" style="display: inline-block;width:40%" required></select>
<script>
let parents = [
    {v:"", m:"일자선택"},
    {v:"9월 8일", m:"9월 8일"},
    {v:"9월 11일", m:"9월 11일"},
];
let child1 = [
    {v:"08:45 퀸메리2", m:"08:45 퀸메리2"},
    {v:"16:45 퀸메리2", m:"16:45 퀸메리2"},
];
let child2 = [
    {v:"08:45 퀸메리2", m:"08:45 퀸메리2"},
    {v:"16:45 퀸메리2", m:"16:45 퀸메리2"},
];
function com_parent() {
    let opt = [];
    parents.forEach(data => {
        opt.push(`<option value="${data.v}">${data.m}</option>`);
    });
    document.getElementById("sel_one").innerHTML = opt.join("");
}
function com_child() {
    let opt = [];
    let oneSel = document.getElementById("sel_one").value;
    
    console.log(oneSel);
    if (oneSel == "") {
    } else {
        if (oneSel == "9월 8일") {
            child1.forEach(data => {
                opt.push(`<option value="${data.v}">${data.m}</option>`);
            });
        } else if (oneSel == "9월 11일") {
            child2.forEach(data => {
                opt.push(`<option value="${data.v}">${data.m}</option>`);
            });
        }
    }
    document.getElementById("sel_two").innerHTML = opt.join("");
}
com_parent();

 


<select id="sel_one2" onchange="com_child2();" name="wr_4" style="display: inline-block;width:40%" required></select>
                    
<select id="sel_two2" name="wr_5" style="display: inline-block;width:40%" required></select>
<script>
let parents2 =[
    {v:"",m:"일자선택"},
    {v:"9월 8일",m:"9월 8일"},
    {v:"9월 11일",m:"9월 11일"},     
];
let child3 = [
    {v:"08:45 퀸메리2", m:"08:45 퀸메리2"},
    {v:"16:45 퀸메리2", m:"16:45 퀸메리2"},
];
let child4 = [
    {v:"08:45 퀸메리2", m:"08:45 퀸메리2"},
    {v:"16:45 퀸메리2", m:"16:45 퀸메리2"},
];
function com_parent2() {
    let opt2 = [];
    parents2.forEach(data => {
        opt2.push(`<option value="${data.v}">${data.m}</option>`);
    });
    document.getElementById("sel_one2").innerHTML = opt2.join("");
}
function com_child2() {
    let opt2 = [];
    let oneSel2 = document.getElementById("sel_one2").value;
    
    console.log(oneSel2);
    if (oneSel2 == "") {
    } else {
        if (oneSel2 == "9월 8일") {
            child3.forEach(data => {
                opt2.push(`<option value="${data.v}">${data.m}</option>`);
            });
        } else if (oneSel2 == "9월 11일") {
            child4.forEach(data => {
                opt2.push(`<option value="${data.v}">${data.m}</option>`);
            });
        }
    }
    document.getElementById("sel_two2").innerHTML = opt2.join("");
}
com_parent2();
답변을 작성하시기 전에 로그인 해주세요.
전체 1
QA 내용 검색
  • 개별 목록 구성 제목 답변작성자조회작성일
  • 질문이 없습니다.

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT