셀렉트 선택시 이미지가 바뀌는데요

셀렉트 선택시 이미지가 바뀌는데요

QA

셀렉트 선택시 이미지가 바뀌는데요

답변 1

본문

<script language="javascript">

function img_change()
{
    var chimg = document.getElementById('one01').value;
         document.all("change_img").innerHTML = "<img src='"+ chimg +"'>";
         
    var val = $(this).val();
    var chimg= "";
    
    if (val == "1단명함꽂이")
         chimg = "img/car3.jpg";
         
     else if (val == "2단명함꽂이")
         chimg = "img/car2.jpg";
         
      else 
         chimg = "img/car.jpg";
         chimg = '<img src="' + chimg + '">';
         $('#change_img').html(chimg);
}
</script>

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


<div id = "change_img" align="center">여기서 내용이 바뀝니다.</div>
 

하다가 잘안되어서 도움을 요청함니다.
value 값은 유지하면서 선택하면 이미지가 바뀌는 건데요
아래 옵션 3개처럼 경로를 넣어서 하는건 잘 되는데...
위에 옵션 2개 처럼 value 값을 유지 하면서 선택시 바뀌게 하려 하니 잘안되네요....

이 질문에 댓글 쓰기 :

답변 1

<script>
function img_change(f) {
    var chimg = '<img src="' + $(f).find('option:selected').data('src') + '">';
    $('#change_img').html(chimg);
}
</script>
<select name="selectBox" onChange="img_change(this);" >
<option value="1단명함꽂이" data-src="img/car.jpg">1단명함꽂이</option>
<option value="2단명함꽂이" data-src="img/car2.jpg">2단명함꽂이</option>
</select>

<div id = "change_img" align="center">여기서 내용이 바뀝니다.</div>

답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
전체 123,731
© SIRSOFT
현재 페이지 제일 처음으로