Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript][HTML]Problem z dynamicznym SELECTem
Forum PHP.pl > Forum > Przedszkole
Ulysess
5.02.2011, 19:10:36
witam , wykorzystałem gotowe rozwiązanie lecz z niewiadomych mi przyczyn nie działa i nigdzie się nie dopatrzyłem błędu..
chodzi o to że chcę wybrać nacje / profesje i w div nacje / profesja miały by się pojawić jakieś dane lecz niestety to nie działa...

[HTML] pobierz, plaintext 
  1. <script type="text/javascript">
  2. function option1(s)
  3. {
  4. if(s.value==1)
  5. nacja.innerHTML = '<span>Siła 5%</span><br/><span>Atak 5%</span><br/><span>Życie 5%</span><br/><span>Obrona 0%</span><br/><span>Charyzma 5%</span><br/><span>Zwinność 5%</span><br/>';
  6. else if(s.value==2)
  7. nacja.innerHTML = '<span>Siła 10%</span><br/><span>Atak 0%</span><br/><span>Życie 0%</span><br/><span>Obrona 0%</span><br/><span>Charyzma 5%</span><br/><span>Zwinność 10%</span><br/>';
  8. else if(s.value==3)
  9. nacja.innerHTML = '<span>Siła 0%</span><br/><span>Atak 0%</span><br/><span>Życie 5%</span><br/><span>Obrona 5%</span><br/><span>Charyzma 10%</span><br/><span>Zwinność 5%</span><br/>';
  10. else if(s.value==4)
  11. nacja.innerHTML = '<span>Siła 10%</span><br/><span>Atak 5%</span><br/><span>Życie 5%</span><br/><span>Obrona 5%</span><br/><span>Charyzma 0%</span><br/><span>Zwinność 0%</span><br/>';
  12. else if(s.value==5)
  13. nacja.innerHTML = '<span>Siła 10%</span><br/><span>Atak 0%</span><br/><span>Życie 10%</span><br/><span>Obrona 5%</span><br/><span>Charyzma 0%</span><br/><span>Zwinność 0%</span><br/>';
  14. }
  15.  
  16. function option2(d)
  17. {
  18. if(d.value==1)
  19. profesja.innerHTML = '<span>Siła 0%</span><br/><span>Atak 5%</span><br/><span>Życie 5%</span><br/><span>Obrona 0%</span><br/><span>Charyzma 5%</span><br/><span>Zwinność 10%</span><br/>';
  20. else if(d.value==2)
  21. profesja.innerHTML = '<span>Siła 15%</span><br/><span>Atak 10%</span><br/><span>Życie 0%</span><br/><span>Obrona 0%</span><br/><span>Charyzma 0%</span><br/><span>Zwinność 0%</span><br/>';
  22. else if(d.value==3)
  23. profesja.innerHTML = '<span>Siła 0%</span><br/><span>Atak 15%</span><br/><span>Życie 0%</span><br/><span>Obrona 0%</span><br/><span>Charyzma 0%</span><br/><span>Zwinność 10%</span><br/>';
  24. else if(d.value==4)
  25. profesja.innerHTML = '<span>Siła 10%</span><br/><span>Atak 5%</span><br/><span>Życie 5%</span><br/><span>Obrona 5%</span><br/><span>Charyzma 0%</span><br/><span>Zwinność 0%</span><br/>';
  26. else if(d.value==5)
  27. profesja.innerHTML = '<span>Siła 0%</span><br/><span>Atak 0%</span><br/><span>Życie 5%</span><br/><span>Obrona 0%</span><br/><span>Charyzma 10%</span><br/><span>Zwinność 10%</span><br/>';
  28. }
  29. </script>
  30.  
  31. <div class="registration">
  32.  
  33. <div style="float: left; width: 50%; border: 0px solid red;">
  34. <form action="rejestracja&amp;weryfikacja=1.html" method="POST">
  35. <table style="margin-left: 20px; width: 100%;">
  36. <tbody>
  37. 	<tr>
  38. 		<td class="alpha"><span class="bold">ID Polecającego:</span><td>
  39. 		<td class="alpha" align="center"><input class="main" onkeyup="this.value=this.value.replace(/\D/g,'')" name="poleca" maxlength="8" value="<?php echo $_SESSION['poleca'];?>" size="26" tabindex="1"/><td>
  40. 	</tr>
  41. 	<tr>
  42. 		<td class="alpha"><span class="bold">Login:</span><td>
  43. 		<td class="alpha" align="center"><input class="main" name="login" maxlength="20" value="<?php echo $_SESSION['login'];?>" size="26" tabindex="2"/><td>
  44. 	</tr>
  45. 	<tr>
  46. 		<td class="alpha"><span class="bold">Nazwa Postaci:</span><td>
  47. 		<td class="alpha" align="center"><input class="main" name="nick" maxlength="40" value="<?php echo $_SESSION['nick'];?>" size="26" tabindex="3"/><td>
  48. 	</tr>
  49. 	<tr>
  50. 		<td class="alpha"><span class="bold">Nacja:</span><td>
  51. 		<td class="alpha" align="center">
  52. 		<select class="main" name="nacja" onchange="option1(this)" tabindex="4">
  53. 			<option value="1">Człowiek</option>
  54. 			<option value="2">Elf</option>   	
  55. 			<option value="3">Niziołek</option>
  56. 			<option value="4">Troll</option>
  57. 			<option value="5">Ork</option>
  58. 		</select>
  59. 		<td>
  60. 	</tr>
  61. 	<tr>
  62. 		<td class="alpha"><span class="bold">Profesja:</span><td>
  63. 		<td class="alpha" align="center">
  64. 		<select class="main" name="profesja" onchange="option2(this)" tabindex="5">
  65. 			<option value="1">Myśliwy</option>
  66. 			<option value="2">Barbarzyńca</option>  	
  67. 			<option value="3">Zabójca</option>
  68. 			<option value="4">Wojownik</option>
  69. 			<option value="5">Złodziej</option>
  70. 		</select>
  71. 		<td>
  72. 	</tr>
  73. 	<tr>
  74. 		<td class="alpha"><span class="bold">Hasło:</span><td>
  75. 		<td class="alpha" align="center"><input class="main" name="haslo" type="password" maxlength="20" value="" size="26" tabindex="6"/><td>
  76. 	</tr>
  77. 	<tr>
  78. 		<td class="alpha"><span class="bold">Powtórz Hasło:</span><td>
  79. 		<td class="alpha" align="center"><input class="main" name="haslo2" type="password" maxlength="20" value="" size="26" tabindex="7"/><td>
  80. 	</tr>
  81. 	<tr>
  82. 		<td class="alpha"><span class="bold">Sekretne Pytanie:</span><td>
  83. 		<td class="alpha" align="center">
  84. 		<select class="main" name="pytanie" tabindex="8">
  85. 			<option value="1">Ulubiony piłkarz</option>
  86. 			<option value="2">Twoja ulubiona potrawa</option>  	
  87. 			<option value="3">Data urodzenia</option>
  88. 			<option value="4">Imię pierwszej miłości</option>
  89. 			<option value="5">Co robisz w wolnym czasie</option>
  90. 		</select>
  91. 		</td>
  92. 	</tr>
  93. 	<tr>
  94. 		<td class="alpha"><span class="bold">Odpowiedz:</span><td>
  95. 		<td class="alpha" align="center"><input class="main" name="pytanie_odpowiedz" maxlength="20" value="<?php echo $_SESSION['pytanie_odpowiedz'];?>" size="26" tabindex="9" /><td>
  96. 	</tr>
  97. 	<tr>
  98. 		<td class="alpha"><span class="bold">E-mail:</span><td>
  99. 		<td class="alpha" align="center"><input class="main" name="email" maxlength="40" value="<?php echo $_SESSION['email'];?>" size="26" tabindex="10" /><td>
  100. 	</tr>
  101. 	<tr>
  102. 		<td class="alpha"><span class="bold">Kod:</span><td>
  103. 		<td class="alpha" align="center"><img src="generator_kodu.php" /><td>
  104. 	</tr>
  105. 	<tr>
  106. 		<td class="alpha"><span class="bold">Przepisz Kod:</span><td>
  107. 		<td class="alpha" align="center"><input class="main" onkeyup="this.value=this.value.replace(/\D/g,'')" name="kod" maxlength="4" value="" size="26" tabindex="11" /><td>
  108. 	</tr>
  109. 	<tr>
  110. 		<td class="alpha"><span class="bold">Akceptacja Regulaminu Gry:</span><td>
  111. 		<td class="alpha" align="center"><input type="checkbox" name="regulamin" value="1" tabindex="12" /><td>
  112. 	</tr>
  113. 	<tr>
  114. 		<td class="alpha"><td>
  115. 		<td class="alpha" align="center"><input class="main" type="submit" value="Rejestruj" tabindex="13" /><td>
  116. 	</tr>
  117. </tbody>
  118. </table>
  119. </form>
  120. </div>
  121.  
  122. <div style="float: left; width: 45%; border: 0px solid red; margin-left: 15px;">
  123. <table style="width: 100%;">
  124. <tbody>
  125. 	<tr align="center">
  126. 		<td class="name" width="50%">Nacja</td>
  127. 		<td class="name" width="50%">Profesja</td>
  128. 	</tr>
  129. 	<tr align="center">
  130. 		<td class="alpha"></td>
  131. 		<td class="alpha"></td>
  132. 	</tr>
  133. </tbody>
  134. </table>
  135.  
  136. <div id="nacja">a</div>
  137. <div id="profesja">b</div>
  138.  
  139. </div>
  140.  
  141.  
  142. </div>
[HTML] pobierz, plaintext
benio101
5.02.2011, 21:08:04 
[HTML] pobierz, plaintext 
  1. <script type="text/javascript">
  2. function option1(s)
  3. {
  4. if(document.getElementById(s).value==1)
  5. document.getElementById(s).innerHTML = '<span>Siła 5%</span><br/><span>Atak 5%</span><br/><span>Życie 5%</span><br/><span>Obrona 0%</span><br/><span>Charyzma 5%</span><br/><span>Zwinność 5%</span><br/>';
  6. if(document.getElementById(s).value==2)
  7. document.getElementById(s).innerHTML = '<span>Siła 10%</span><br/><span>Atak 0%</span><br/><span>Życie 0%</span><br/><span>Obrona 0%</span><br/><span>Charyzma 5%</span><br/><span>Zwinność 10%</span><br/>';
  8. if(document.getElementById(s).value==3)
  9. document.getElementById(s).innerHTML = '<span>Siła 0%</span><br/><span>Atak 0%</span><br/><span>Życie 5%</span><br/><span>Obrona 5%</span><br/><span>Charyzma 10%</span><br/><span>Zwinność 5%</span><br/>';
  10. if(document.getElementById(s).value==4)
  11. document.getElementById(s).innerHTML = '<span>Siła 10%</span><br/><span>Atak 5%</span><br/><span>Życie 5%</span><br/><span>Obrona 5%</span><br/><span>Charyzma 0%</span><br/><span>Zwinność 0%</span><br/>';
  12. if(document.getElementById(s).value==5)
  13. document.getElementById(s).innerHTML = '<span>Siła 10%</span><br/><span>Atak 0%</span><br/><span>Życie 10%</span><br/><span>Obrona 5%</span><br/><span>Charyzma 0%</span><br/><span>Zwinność 0%</span><br/>';
  14. }
[HTML] pobierz, plaintext 
[HTML] pobierz, plaintext 
  1. 	<tr>
  2. 		<td class="alpha"><span class="bold">Nacja:</span><td>
  3. 		<td class="alpha" align="center">
  4. 		<select class="main" id="nacja" name="nacja" onchange="option1('nacja')" tabindex="4">
  5. 			<option value="1">Człowiek</option>
  6. 			<option value="2">Elf</option>   	
  7. 			<option value="3">Niziołek</option>
  8. 			<option value="4">Troll</option>
  9. 			<option value="5">Ork</option>
  10. 		</select>
  11. 		<td>
  12. 	</tr>
[HTML] pobierz, plaintext

Działa?
Ulysess
5.02.2011, 21:16:19
hmm nie , dodatkowo ustawiłem id diva na s bo wydaje mi się że tak powinien się nazywać w Twoim rozwiązaniu..
benio101
5.02.2011, 21:25:16 
[HTML] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
  2. <html>
  3. <head>
  4. 	<title>New document</title>
  5. <meta name="generator" content="TSW WebCoder">
  6. <script type="text/javascript">
  7. function option1(s,s1)
  8. {
  9. if(document.getElementById(s).value==1)
  10. document.getElementById(s1).innerHTML = '<span>Siła 5%</span><br/><span>Atak 5%</span><br/><span>Życie 5%</span><br/><span>Obrona 0%</span><br/><span>Charyzma 5%</span><br/><span>Zwinność 5%</span><br/>';
  11. if(document.getElementById(s).value==2)
  12. document.getElementById(s1).innerHTML = '<span>Siła 10%</span><br/><span>Atak 0%</span><br/><span>Życie 0%</span><br/><span>Obrona 0%</span><br/><span>Charyzma 5%</span><br/><span>Zwinność 10%</span><br/>';
  13. if(document.getElementById(s).value==3)
  14. document.getElementById(s1).innerHTML = '<span>Siła 0%</span><br/><span>Atak 0%</span><br/><span>Życie 5%</span><br/><span>Obrona 5%</span><br/><span>Charyzma 10%</span><br/><span>Zwinność 5%</span><br/>';
  15. if(document.getElementById(s).value==4)
  16. document.getElementById(s1).innerHTML = '<span>Siła 10%</span><br/><span>Atak 5%</span><br/><span>Życie 5%</span><br/><span>Obrona 5%</span><br/><span>Charyzma 0%</span><br/><span>Zwinność 0%</span><br/>';
  17. if(document.getElementById(s).value==5)
  18. document.getElementById(s1).innerHTML = '<span>Siła 10%</span><br/><span>Atak 0%</span><br/><span>Życie 10%</span><br/><span>Obrona 5%</span><br/><span>Charyzma 0%</span><br/><span>Zwinność 0%</span><br/>';
  19. }
  20. </script>
  21. </head>
  22.  
  23. <body>
  24. <table>
  25. <tr>
  26. 		<td class="alpha"><span class="bold">Nacja:</span><td>
  27. 		<td class="alpha" align="center">
  28. 		<select class="main" id="nacja" name="nacja" onchange="option1('nacja','nacja_opis')" tabindex="4">
  29. 			<option value="1">Człowiek</option>
  30. 			<option value="2">Elf</option>   	
  31. 			<option value="3">Niziołek</option>
  32. 			<option value="4">Troll</option>
  33. 			<option value="5">Ork</option>
  34. 		</select>
  35. 		<p id="nacja_opis">
  36. 		<span>Siła 5%</span><br/><span>Atak 5%</span><br/><span>Życie 5%</span><br/><span>Obrona 0%</span><br/><span>Charyzma 5%</span><br/><span>Zwinność 5%</span><br/>
  37. 		</p>
  38. 		<td>
  39. 	</tr>
  40. </table>
  41. </body>
  42. </html>
[HTML] pobierz, plaintext


Gdy zmienisz innerHTML selectu, to Ci nie wyjdzie, innerHTML musi osnosić się do innego zbiornika, np. p, a, td itd itp.
Tutaj tkwił problem. Powyżej przykladowy fragment, który działa.
Jak to poprawić w Twoim kodzie, pomyśl sam.

P.S. Faktycznie, zapomniałem dodać id.
benio101
5.02.2011, 21:45:49
Zapomniałeś 2. argumentu...
popraw:
[HTML] pobierz, plaintext 
  1. function option1(a,s1)
  2. function option2(b,s2)
[HTML] pobierz, plaintext

I jak? Działa?
Ulysess
5.02.2011, 21:46:33
właśnie sam się domyśliłem że tutaj źle zrobiłem , działa . wielkie dzięki smile.gif
benio101
5.02.2011, 21:50:08
Proszę bardzo medieval.gif
I również dziękuję, za pomarańczowe tełko specool.gif
Ulysess
5.02.2011, 21:54:27
kurde mam jeszcze taki problem że nie mogę tego ostylować :| próbuję <span class="bold"> nie działa <span class=\"bold\"> również :|
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.