자바 스크립트 CJT Combobox를 사용하여 그림을 변경하십시오

Im는 자바 스크립트를 사용하고 im은 wordpress 용 CJT 플러그인을 사용합니다. 필자는 콤보 상자에서 다른 값이 선택되었을 때 그림을 변경하려고했지만 작동에 문제가 있습니다. 나는 어디서 잘못 가고 있는지 누군가가 무엇을 잘못하고 있는지 설명하고 싶습니다. 내가 가지고있는 코드는 다음과 같습니다 :자바 스크립트 CJT Combobox를 사용하여 그림을 변경하십시오

<html> 
<body> 
<script> 
var pictureList = [ 
    "(url)/image1.png", 
    "(url)/image2.png", 
    "(url)/image3.png", 
    "(url)/image4.png", 
    "(url)/image5.png", ]; 

$('#imagePic').change(function() { 
    var val = parseInt($('#imagePic').val()); 
    $('img').attr("src",pictureList[val]); 
}); 
</script> 

<img src="(url)/image1.png" /> 
<select id="imagePic"> 
    <option value="image1" selected>Picture 1</option> 
    <option value="image2">Picture 2</option> 
    <option value="image3">Picture 3</option> 
    <option value="image4">Picture 4</option> 
    <option value="image5">Picture 5</option> 
</select> 

</body> 
</html>

(url)은 이미지의 올바른 URL입니다.

출처

2014-10-21 user1854914

이 시도 :

var pictureList = [ 
    "(url)/image1.png", 
    "(url)/image2.png", 
    "(url)/image3.png", 
    "(url)/image4.png", 
    "(url)/image5.png" 
]; 

$('#imagePic').change(function() { 
    var index = $(this).find(':selected').index(); 
    $('img').attr("src", pictureList[index]); 
});

그런 식으로 당신이 선택한 옵션의 인덱스를 얻을 수 있습니다. 또한 배열의 마지막 항목 뒤에있는 쉼표를 제거하십시오.

출처

2014-10-21 10:14:30 Danijel

Ive는이 방법을 시도했지만 이미지는 여전히 콤보 상자의 선택에 따라 변경되지 않습니다. 이미지는 기본 이미지로 유지됩니다. – user1854914

선택 상자 뒤에 스크립트를 놓고 [domready] (http://api.jquery.com/ready/) 이벤트'jQuery (function ($) {/ * 여기에 자바 스크립트 코드 넣기 * /}); ' – Danijel

필자는 이것을했지만 여전히 운이 없다 :/ – user1854914

자바 스크립트 CJT Combobox를 사용하여 그림을 변경하십시오

답변

관련 문제