Javascript - 基本的なプログラミング、画像を変更することはできません

私は5つのjpg画像を持っており、ホームページでは1,2,3,4,5を入力してこれらの5つの画像を選択してOKをクリックしてから、表示する。Javascript - 基本的なプログラミング、画像を変更することはできません

私のコードは次のようになります。

var inputElem, msgElem; 

function init() { 
msgElem = document.getElementById("message"); 
    inputElem = []; 
    inputElem[1] = document.getElementById("input1"); 
    inputElem[2] = document.getElementById("input2"); 
    inputElem[3] = document.getElementById("input3"); 
    document.getElementById("btn1").onclick = showFruit; 

} 

window.onload = init; 

function showFruit() { 
var nr, fruitUrl; 

fruitUrl = (fruitImg.src = "pics/fruit" + nr + ".jpg"); 
nr = Number(input1.value); 

fruitImg.src = "pics/fruit" + nr + ".jpg"; 

fruitUrl = document.getElementById("fruitImg").src = "pics/fruit1.jpg";

問題は、私はいただきました！欠落しているかわからないpicture.Iを変更できないということである、またはそれは、PIC 1-5の間で選択するためにどのように。だから、常にこのコード行で最初の画像をassingingしていることを

出典

2016-04-10 cassandra

注意（最後Iineあなたのコードの場合）

fruitUrl = document.getElementById("fruitImg").src = "pics/fruit1.jpg";

、あなたは常に画像1

出典

2016-04-10 12:15:50 Jorge

を参照してくださいよ、私はありません持っていますコメントを書く特権、あなたが実際に望むものを見積もることはできません。しかし、結果として得られる効果があなたが望むものかもしれません。

しかし、以下の例を参照してください（live here）。番号を入力し、ボタンをクリックします。例（live here）以下で

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 

</head> 
<body> 

<div id="image"> 
    <img src="salon1.jpg" id="fruit"> 
</div> 
     <input type="number" id="inp"> 
     <input type="submit" id="btn1" onclick="showFruit('inp')"> 

<script type="text/javascript"> 

    makeImageFromNum = function (n) { 
     var nr = document.getElementById(n).value; 
     if (parseInt(nr)>5) { 
      nr = 5; 
     } 
     else if (parseInt(nr)<1) { 
      nr = 1; 
     } 
     return "salon"+nr+".jpg"; 
    } 

    showFruit = function (n) { 
     document.getElementById("fruit").src = makeImageFromNum(n); 
    } 

</script> 
</body> 
</html>

ちょうど数変更 - ボタンをクリックする必要はありませんが、何も任意の実際にはありません:)

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 

</head> 
<body> 

<div id="image"> 
    <img src="salon1.jpg" id="fruit"> 
</div> 
     <input type="number" id="inp" onchange="showFruit(this.value)"> 

<script type="text/javascript"> 

    makeImageFromNum = function (nr) { 
     if (parseInt(nr)>5) { 
      nr = 5; 
     } 
     else if (parseInt(nr)<1) { 
      nr = 1; 
     } 
     return "salon"+nr+".jpg"; 
    } 

    showFruit = function (n) { 
     document.getElementById("fruit").src = makeImageFromNum(n); 
    } 

</script> 
</body> 
</html>

出典

2016-04-10 17:59:09

Javascript - 基本的なプログラミング、画像を変更することはできません

答えて

関連する問題