그누보드 QA - 셀렉트 박스에서 이미지 체인지

셀렉트 박스에서 이미지 체인지

세상의지배자 자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색

자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색

2018.06.20 20:06:03 2765 (175.♡.♡.134)

본문

var one01 = document.getElementById('one01').value;
document.all("dynamic_img").innerHTML = "<img src='img/car.jpg'>";

}
</script>
<select name="selectBox" id="one01" onChange="img_change();" >
<option value="1단명함꽂이">나</option>
<option value="2단명함꽂이">센서그림</option>
<option value="3단명함꽂이">회사그림</option>
<option value="img/car3.jpg">이미지</option>
</select>

위처럼 하면 이미지 체인지를 할수 있는데...
아이디 값을 넣는다던지 해서
value 값은 그대로 유지 하면서 바뀌게 하고 싶은데 잘 안되네요
어떻게 하면 될까요?

#그누보드5

답변 4

트샷 자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색 님의 답변

2018-06-20 22:45:49 220.♡.♡.82

※ https://opentutorials.org/course/53/45

※ https://www.w3schools.com/jquery/jquery_selectors.asp


<script>
$(function() {
    $('#one01').on('change', function() {
        var selected_val = $(this).val();
        var str = "";
        
        if (selected_val == "1단명함꽂이")
            str = "img/img1.jpg";
        else if (selected_val == "2단명함꽂이")
            str = "img/img2.jpg";
        else if (selected_val == "3단명함꽂이")
            str = "img/img3.jpg";
        else if (selected_val == "img/car3.jpg")
            str = "img/car3.jpg";
 
        str = '<img src="' + str + '">'; 
            
        $('#dynamic_img').html(str);
    });    
});    
</script>
 
<select name="selectBox" id="one01">
    <option value="1단명함꽂이">나</option>
    <option value="2단명함꽂이">센서그림</option>
    <option value="3단명함꽂이">회사그림</option>
    <option value="img/car3.jpg">이미지</option>
</select>
 
<div id="dynamic_img" align="center">여기서 내용이 바뀝니다.</div>