셀렉트 박스에서 이미지 체인지
본문
<script type="text/javascript">
function img_change()
{
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>
<div id = "dynamic_img" align="center">여기서 내용이 바뀝니다.</div>
위처럼 하면 이미지 체인지를 할수 있는데...
아이디 값을 넣는다던지 해서
value 값은 그대로 유지 하면서 바뀌게 하고 싶은데 잘 안되네요
어떻게 하면 될까요?
답변 4
※ 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>
질문이 이해가안가네요..
질문이 이해가안가네요..
오 저런 질문이여구나 트샷님 대단