Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

tiong

[Resolvido] Form carregando imagem automaticamente

Por , em Javascript

Recommended Posts

tiong    0

tiong
Postado

E aí pessoal sou novo/velho no fórum rsrs

Vamos ao ponto, eu entendo um bocado de html e talz o suficiente pra quebrar o galho mas estou travado aqui com um problemão e preciso de uma solução urgente.

Se eu estiver na área errada plz admins podem mudar a vontade rsrs

 

Preciso criar um form basico, que ao selecionar uma opção, automaticamente carregue a imagem correspondente (sem botões de send nem nada, selecionou a opção carregou a imagem).

Então vamos a um exemplo:

 

<form id="imagem" name="Curso" method="?" action="">
 <p>
   <label for="crs">Selecione a Imagem: </label>
   <select name="crs" id="crs">
     <option value="imagea.jpg">Imagem 1</option>
     <option value="imageb.jpg">Imagem 2</option>
   </select>
 </p>
</form>

<img src="<aqui aparece o value>">

 

 

Aceito sugestões mas a função tem que ser a mesma e o usuário precisa que isso carregue imediatamente sem frescurinhas

Compartilhar este post

Link para o post
Compartilhar em outros sites

Ted k'    126

Ted k'
Postado

Veja esse exemplo aqui:

 

<!DOCTYPE HTML>
<html><head>
<meta charset="UTF-8">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script language="javascript">
$(function(){
$("#crs").change(function () {
         var str = "";
         $("#crs option:selected").each(function () {
               str += $(this).val() + " ";
             });
         $("#resposta-imagem").attr("src", str);
       })
       .change();
});
</script>

<title>HTML5</title>
</head>
<body>
<form id="imagem" name="Curso" method="?" action="">
 <p>
   <label for="crs">Selecione a Imagem: </label>
   <select name="crs" id="crs">
     <option value="imagea.jpg">Imagem 1</option>
     <option value="imageb.jpg">Imagem 2</option>
   </select>
 </p>
</form>

<img id="resposta-imagem" src="" />
</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

tiong    0

tiong
Postado

Nossa cara... obrigadão mesmo, funcionou perfeitamente e pensar q me matei de procurar durante meses só pra descobrir que... caramba, não é tão dificil assim rsrs

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito