Schimbare imagine cu optiuni din lista select
Discutii si intrebari legate de scripturi si functii JavaScript, jQuery si Ajax, cod JavaScript in general.
-
patricia
- Mesaje:82
Schimbare imagine cu optiuni din lista select
Am incercat un script:prin intermediul unei liste de selectie sa schimb o imagine.
Am incercat prin doua metode, una dintre ele nu a functionat (am pus codul mai jos):
Cod: Selectaţi tot
<img src="img1.jpg" name="lista" width="200" height="200"><br>
<form>
<select name="imagini">
<option value="img1.jpg" onclick="schimbare(this.value);">prima imagine</option>
<option value="img3.jpg" onclick="schimbare(this.value);">a doua imagine</option>
<option value="img4.jpg" onclick="schimbare(this.value);">a treia imagine</option>
<option value="img5.jpg" onclick="schimbare(this.value);">a patra imagine</option>
</select>
</form>
<script type="text/javascript">
function schimbare(sursa){
document.lista.src=sursa;
}
</script>
Ce e in neregula si de ce?
MarPlo
Mesaje:4343
Salut
Ca sa preiei optiunea selectata dintr-o lista Select, se adauga evenimentul in tag-ul <select> (de regula
onchange ).
In tagul <img> este indicat sa folosesti atributul ID, si prin el sa preiei elementul in codul JavaScript.
Rezolvare:
Cod: Selectaţi tot
<img src="img1.jpg" id="lista" width="200" height="200" alt="Titlu imagine"><br/>
<form>
<select name="imagini" onchange="schimbare(this.value);">
<option value="img2.jpg">prima imagine</option>
<option value="img3.jpg">a doua imagine</option>
<option value="img4.jpg">a treia imagine</option>
<option value="img5.jpg">a patra imagine</option>
</select>
</form>
<script type="text/javascript"><!--
// schimba adresa imaginii cu cea din "sursa"
function schimbare(sursa){
// http://www.coursesweb.net/javascript/
document.getElementById('lista').src = sursa;
}
//-->
</script>
Subiecte similare
- Setare valori din array in select tag
JavaScript - jQuery - Ajax
Primul mesaj
Salut am un array cu orele de functionare
$data = array (
'0400' => '04:00 AM',
'0430' => '04:30 AM',
'0500' => '05:00 AM',
'0530'...
Ultimul mesaj
Testeaza urmatorul cod.
Daca ceva mai trebuie schimbat, incearca si tu sa modifici dupa cum stii, in functie de ce vrei sa obtii.
Open:...