Modifier une image en utilisant la valeur saisie dans une zone de texte

Question

Nouveauté de Javascript et j'apprécierais de vous aider avec ce qui suit, soyez gentil avec moi.

Je voudrais changer une image en fonction de la valeur tapée dans une zone de texte.

Mon scénario est

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> 


script type="text/javascript"> 
function ParImg(Change) { 
    var ParImg = document.getElementById("<%=TextBox1.ClientID%>").value; 
    alert(ParImg); 
    Img1.src = Change + ".jpg"; 
    } 
</script> 

<img id="Img1" src='apicture.jpg' alt="Random Image" /> 

L'alerte montre tout ce qui est tapé dans la zone de texte, mais l'image ne change pas la valeur par défaut.

Toute réflexion sur où je me trompe ou même cela peut être fait du tout

Answer 1

Vous devez utiliser getElementById pour obtenir l'image et

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> 


<script type="text/javascript"> 
function ParImg(Change) { 
    var ParImg = document.getElementById("<%=TextBox1.ClientID%>").value; 
    alert(ParImg); 
    var Img1 = document.getElementById("Img1"); 
    Img1.src = Change + ".jpg"; 
    } 
</script> 

<img id="Img1" src='apicture.jpg' alt="Random Image" /> 

Answer 2

vous avez besoin

Img1 = document.getElementById("Img1");

vous devriez obtenir une erreur pour la ligne Img1.src car il n'y a pas d'Img1 déclaré à l'avance

Answer 3

Votre fonction ne sait pas ce qu'est Img1. Essayez de la suggestion

document.getElementById("Img1").src = Change_".jpg";