Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [Javascript] Zmiana obrazka i checkboxa z przekazaniem zmienych - beginner ;-)
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
messmaker
23.03.2009, 15:17:21
Jakiś czas temu pytałem o przekazywanie zmiennych do funkcji w JS, coś pokleiłem ale za chiny nie chce mi to działać tak jak powinno. Oto kod:

[HTML] pobierz, plaintext 
  1. <head>
  2. <script type="text/javascript">
  3. function changePic(item,icon){
  4. if ('c' + item.checked){
  5. document.'i' + item.src="icon + '_c'.gif";
  6. }else{
  7. document.'i' + item.src="icon + '_u'.gif";
  8. }
  9. }</script>
  10. </head>
  11. <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
  12. <form name="form1" method="post" action="">
  13. <img src="5_u.gif" name="i1"> 
  14. <input type="checkbox" name="c1" value="checkbox" onClick="changePic(1,5);">
  15. </form>
  16. </body>
[HTML] pobierz, plaintext


Mam nadzieję, że w miarę czytelny. Można prosić o pomoc?
skowron-line
23.03.2009, 15:22:45 
[HTML] pobierz, plaintext 
  1. <head>
  2. <script type="text/javascript">
  3. function changePic(item,icon){
  4. if ('c' + item.checked){
  5. document.getElementById( 'i' + item ).src="icon + '_c'.gif";
  6. }else{
  7. document.getElementById( 'i' + item ).src="icon + '_u'.gif";
  8. }
  9. }</script>
  10. </head>
  11. <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
  12. <form name="form1" method="post" action="">
  13. <img src="5_u.gif" name="i1" id="i1">
  14. <input type="checkbox" name="c1" value="checkbox" onClick="changePic(1,5);">
  15. </form>
  16. </body>
[HTML] pobierz, plaintext

można tak, lub jak nie chcesz używać id to poczytaj o document.getElementsByTagName
messmaker
23.03.2009, 15:27:37
Wkleiłem i coś już się zaczęło dziać, ale po kliknięciu w czekboks zmienia src obrazka na icon%20+%20'_c'.gif ohmy.gif
skowron-line
23.03.2009, 15:28:56
Cytat(messmaker @ 23.03.2009, 15:27:37 ) *
Wkleiłem i coś już się zaczęło dziać, ale po kliknięciu w czekboks zmienia src obrazka na icon%20+%20'_c'.gif ohmy.gif

%20 to spacja.

żebyś się nie głowił

Kod
"icon + '_u'.gif";

na
Kod
icon + '_u'.gif";
wookieb
23.03.2009, 15:29:59
...
Kod
icon+'_u.gif';
messmaker
23.03.2009, 15:35:12
Wsadziłem:

[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3. <script type="text/javascript">
  4. function changePic(item,icon){
  5. if ('c' + item.checked){
  6. document.getElementById( 'i' + item ).src=icon+'_c.gif';
  7. }else{
  8. document.getElementById( 'i' + item ).src=icon+'_u.gif';
  9. }
  10. }</script>
  11. </head>
  12. <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
  13. <form name="form1" method="post" action="">
  14. <img src="5_u.gif" name="i1" id="i1">
  15. <input type="checkbox" name="c1" value="checkbox" onClick="changePic(1,5);">
  16. </form>
  17. </body>
  18. </html>
[HTML] pobierz, plaintext


i przy każdym kliknięciu na checkbox (zaznaczającym lub nie) ustawiany jest 5_c.gif. 5_c to animacja "zaznaczania", 5_u to obrazek sygnalizujący brak zaznaczenia, obecnie każde kliknięcie w CB powoduje wywołanie animacji zaznaczania na obrazku.




EDIT: udało się smile.gif

[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3. <script type="text/javascript">
  4. function changePic(item,icon){
  5. if (document.getElementById( 'c' + item ).checked){
  6. document.getElementById( 'i' + item ).src=icon+'_c.gif';
  7. }else{
  8. document.getElementById( 'i' + item ).src=icon+'_u.gif';
  9. }
  10. }</script>
  11. </head>
  12. <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
  13. <form name="form1" method="post" action="">
  14. <img src="5_u.gif" id="i1">
  15. <input type="checkbox" id="c1" value="checkbox" onClick="changePic(1,5);">
  16. </form>
  17. </body>
  18. </html>
[HTML] pobierz, plaintext
wookieb
23.03.2009, 15:38:19
A po co ci to 'c' +?
Popraw analogicznie do poprzedniej poprawki.
I nie mow ze nie umiesz bo wystarczy sie troche zastanowic.
skowron-line
23.03.2009, 15:39:00 
[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3. <script type="text/javascript">
  4. function changePic(item,icon){
  5.  
  6.  
  7. if (document.getElementById( 'c' + item ).checked){
  8. document.getElementById( 'i' + item ).src=icon+'_c.gif';
  9. }else{
  10. document.getElementById( 'i' + item ).src=icon+'_u.gif';
  11.  
  12. }
  13. }</script>
  14. </head>
  15. <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
  16. <form name="form1" method="post" action="">
  17. <img src="5_u.gif" name="i1" id="i1">
  18. <input type="checkbox" name="c1" id="c1" value="checkbox" onClick="changePic(1,5);">
  19. </form>
  20. </body>
  21. </html>
[HTML] pobierz, plaintext
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.