PRoblema

[carlos__333]

Bueno quiciera saber si me podian ayudar a hacer algo q tenia pensado vera mi idea es colocar un selec y pues q aparescan varias opciones (1,2,3) y q existan 3 imagenes estas tres imagenes estarian en un div o x el caso es q lo q sta en ese div (la imagen) cambiaria dependiendo del selec q yo kiera si el selec coloco <option>1</option> pues en mi div saldria la imagen 1 alguna idea? mi idea era cambiar la promiedad src es decir la url de la imagen del tag img nc q otra tienen?

[ArturoGallegos]

pues tu idea anda muy acertada utiliza en javascript el evento onchange dentro del select y has que cambie el src y alt de la imagen con la condicional if

[laratik]

es un script bastante sencillo, es algo como esto:

Código HTML:

<select id="select" onchange="prueba()">
<option value="0">flor</option>
<option value="1">mi casa</option>
<option value="2">mi finca</option>
</select>
<div>
<img src="images.jpg" id="target" />
</div>
 

Código Javascript:

function prueba() {
    var sel = document.getElementById("select").selectedIndex;
    if(sel == 0) {
        document.getElementById("target").src = "images.jpg";
    }
    if(sel == 1) {
        document.getElementById("target").src = "images2.jpg";
    }
    if(sel == 2) {
        document.getElementById("target").src = "images3.jpg";
    }
}
 

[carlos__333]

Mmmmm ok bueno es lo q mas o mens me imaginaba hacer pero keria ver si habia algo mas sencillo gracias gente :D

[carlos__333]

Buenas de nuevo saben q quiero hacerlo pero el tag img esta dentro de una imagen y son varios tag sin embago pues no logro ejecutar pondre el codigo a ver si me pueden ayudar

Código:

FUNCION JAVA SCRIPT

  function cambio() {
    var diente = document.getElementById("diente").selectedIndex;
	var xdo = document.getElementById("xdo").selectedIndex;
	//var hecho = document.getElementById("hecho").selectedIndex;
    
	if(xdo == 1) {
        document.getElementById(diente).src = "1.png";
    }
    if(xdo == 2) {
        document.getElementById(diente).src = "2.png";
		
    }
    if(xdo == 3) {
        document.getElementById(diente).src = "3.png";
		
    }
}

y esta es la tabla con que estoy trabajando a ver si me pueden ayudar :D

<table width="936" height="552" border="1" align="center">
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td><div id="cambios2">
<p>Diente
<select name="diente" id="diente">
<option value="0">Eliga una Opcion</option>
<option value="18">18</option>
<option value="17">17</option>
<option value="16">16</option>
<option value="15">15</option>
<option value="14">14</option>
<option value="13">13</option>
<option value="12">12</option>
<option value="11">11</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="48">48</option>
<option value="47">47</option>
<option value="46">46</option>
<option value="45">45</option>
<option value="44">44</option>
<option value="43">43</option>
<option value="42">42</option>
<option value="41">41</option>
<option value="31">31</option>
<option value="32">32</option>
<option value="33">33</option>
<option value="34">34</option>
<option value="35">35</option>
<option value="36">36</option>
<option value="37">37</option>
<option value="38">38</option>
</select>
Efecto: Por hacer
<label for="efecto"></label>
<select name="xdo" id="xdo" onchange="cambio() ">
<option value="0" selected="selected">Eliga una Opcion</option>
<option value="1" >Corona</option>
<option value="2">Tratamiento Conducto</option>
<option value="3">Diente Reparado con defecto</option>
</select>
Hecho
<label for="hecho"></label>
<select name="hecho" id="hecho">
<option value="0">Eliga una Opcion</option>
<option value="1">Corona</option>
<option value="2">Tratamiento Conducto</option>
<option value="3">Por Sacar</option>
</select>
<input type="submit" value="Aceptar" onclick="cambio() " />
</p>
</div>
<table width="906" height="173" border="0">
<tr>
<td><table width="200" border="0">
<tr>
<td><label>18</label><br /><div><img src="#" id="18" height="35" width="50"/></div></td>
<td><label>17</label><br /><div><img src="#" id="17" height="35" width="50"/></div></td>
<td><label>16</label><br /><div><img src="#" id="16" height="35" width="50"/></div></td>
<td><label>15</label><br /><div><img src="#" id="15" height="35" width="50"/></div></td>
<td><label>14</label><br /><div><img src="#" id="14" height="35" width="50"/></div></td>
<td><label>13</label><br /><div><img src="#" id="13" height="35" width="50"/></div></td>
<td><label>12</label><br /><div><img src="#" id="12" height="35" width="50"/></div></td>
<td><label>11</label><br /><div><img src="#" id="11" height="35" width="50"/></div></td>
</tr>
</table></td>
<td><table width="200" border="0">
<tr>
<td><label>21</label><br /><div><img src="#" id="21" height="35" width="50"/></div></td>
<td><label>22</label><br /><div><img src="#" id="22" height="35" width="50"/></div></td>
<td><label>23</label><br /><div><img src="#" id="23" height="35" width="50"/></div></td>
<td><label>24</label><br /><div><img src="#" id="24" height="35" width="50"/></div></td>
<td><label>25</label><br /><div><img src="#" id="25" height="35" width="50"/></div></td>
<td><label>26</label><br /><div><img src="#" id="26" height="35" width="50"/></div></td>
<td><label>27</label><br /><div><img src="#" id="27" height="35" width="50"/></div></td>
<td><label>28</label><br /><div><img src="#" id="28" height="35" width="50"/></div></td>
</tr>
</table></td>
</tr>
<tr>
<td><table width="200" border="0">
<tr>
<td><label>48</label><br /><div><img src="#" id="48" height="35" width="50"/></div></td>
<td><label>47</label><div><img src="#" id="47" height="35" width="50"/></div></td>
<td><label>46</label><div><img src="#" id="46" height="35" width="50"/></div></td>
<td><label>45</label><div><img src="#" id="45" height="35" width="50"/></div></td>
<td><label>44</label><div><img src="#" id="44" height="35" width="50"/></div></td>
<td><label>43</label><div><img src="#" id="43" height="35" width="50"/></div></td>
<td><label>42</label><div><img src="#" id="42" height="35" width="50"/></div></td>
<td><label>41</label><div><img src="#" id="41" height="35" width="50"/></div></td>
</tr>
</table></td>
<td><table width="200" border="0">
<tr>
<td><label>31</label><br /><div><img src="#" id="31" height="35" width="50"/></div></td>
<td><label>32</label><div><img src="#" id="32" height="35" width="50"/></div></td>
<td><label>33</label><div><img src="#" id="33" height="35" width="50"/></div></td>
<td><label>34</label><div><img src="#" id="34"height="35" width="50"/></div></td>
<td><label>35</label><div><img src="#" id="35" height="35" width="50"/></div></td>
<td><label>36</label><div><img src="#" id="36"height="35" width="50"/></div></td>
<td><label>37</label><div><img src="#" id="37"height="35" width="50"/></div></td>
<td><label>38</label><div><img src="#" id="38" height="35" width="50"/></div></td>
</tr>
</table></td>
</tr>
</table>
<p></p></td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>
<p>&nbsp;</p>

[carlos__333]

ya resolvi al parecer no estaba tomando el valor verdader del select diente ya lo coji y funciona a la perfeccion :D cualkier