function img_change() { var one01 = document.getElementById('one01').value; document.all("dynamic_img").innerHTML = ""; } 나 센서그림 회사그림 이미지 여기서 내용이 바뀝니다. 위처럼 하면 이미지 체인지를 할수 있는데... 아이디 값을 넣는다던지 해서 value 값은 그대로 유지 하면서 바뀌게 하고 싶은데 잘 안되네요 어떻게 하면 될까요?

이전 목록 다음

채택완료

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

세상의지배자

2018-06-20 (수) 20:06:03 3,459

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개 / 댓글 1개

채택된 답변

+20 포인트

트샷

프로필 보기 이 회원 글보기 이 회원의 댓글보기

2018-06-20 (수) 22:45:49

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

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

Copy

<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>