Cambiar imagen con select

fcosun · #1 (**permalink**) 26/09/2014, 13:28

Hola,

Como puedo cambiar de imagen al seleccionar un select, aca tengo este codigo.

Código HTML:

Ver original<html>
    <head>
    <title>jQuery - Clases</title>
        <script src="js/jquery-1.7.2.js" type="text/javascript"></script>
    </head>
   
    <script type="text/javascript">
        $(document).ready(function(){           
            $("#seleccion").change(function() {
                var num = $(this).val();
               
                if(num == 1){
                    valor = 'manzana.jpg';
                }
                if(num == 2){
                    valor = 'gato.jpg';
                }
               
                $('#caja1').val(valor);
            });           
        });
    </script>
   
<body>
 
<select id="seleccion">
    <option value='1'>Manzana</option>
    <option value='2'>Gato</option>   
</select>
 
<img id="caja1" src='images/'/>
 
</body>   
</html>

Alexis88 · #2 (**permalink**) 26/09/2014, 14:19

Al elemento <img> no le puedes asignar un valor pues no posee el atributo value. Lo que debes de hacer es modificar su atributo src.

Código Javascript:

Ver original$('#caja1').prop("images/" + valor);

Saludos

fcosun · #3 (**permalink**) 27/09/2014, 14:37

Como modifico el atributo src con el metodo .prop ?, no entendi como hacerlo.

Código Javascript:

Ver original$('#caja1').prop("images/" + valor);

Código HTML:

Ver original<img id="caja1" src=''> </img>

Alexis88 · #4 (**permalink**) 27/09/2014, 17:49

Perdón, olvidé colocar al atributo:

Código Javascript:

Ver original$('#caja1').prop("src", "images/" + valor);

Saludos

fcosun · #5 (**permalink**) 27/09/2014, 22:36

Te lo agradezco mucho

Alexis88

, funciona de maravilla