Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [javascript] skrypt wyboru
Forum PHP.pl > Forum > Po stronie przeglądarki
mari6274
Mógłby mi ktoś powiedzieć, czy taki skrypt ma prawo działaćquestionmark.gif Jesli nie to dlaczego, jeśli tak to co robie źle, że nie działa mi prawidłowo.
  1. <p>
  2.  
  3. <input type='radio' name='typg' id='1' value='1' checked='checked'>
  4. <input type='radio' name='typg' id='2' value='2'>
  5. </p>
  6.  
  7.  
  8. document.getElementById('d2').style.display = 'none';
  9. if(document.getElementById(1).checked) {
  10. document.getElementById('d1').style.display = 'block';
  11. document.getElementById('d2').style.display = 'none';
  12. }
  13. else if(document.getElementById(2).checked) {
  14. document.getElementById('d2').style.display = 'block';
  15. document.getElementById('d1').style.display = 'none';
  16. }
  17.  
  18. </script>
  19.  
  20. <p>
  21. <div id='d1'>
  22.  
  23.  
  24. //skrypt JS
  25.  
  26.  
  27. </div>
  28. <div id='d2'>
  29.  
  30. //Kod HTML
  31. //+
  32. //Skrypt JS
  33.  
  34.  
  35. </div>
  36. </p>
kamil4u
Cytat
getElementById(1)

ID nie może być liczbą. I jeśli już to musisz użyć cudzysłowowa.

Jeżeli nadal nie działa to będę szukał dalej smile.gif

--edit--
I zawsze patrz do konsoli błędów.
mortus
Według specyfikacji wartość atrybutu id elementu HTML nie może być cyfrą, liczbą, a nawet nie może się cyfrą rozpoczynać. Problemem jest jednak nieprawidołowy argument metody getElementById, bo powinien on być objęty cudzysłowami lub apostrofami. Poza tym skrypt powinien się raczej znaleźć za div-ami d1 i d2, bo wcześniej te elementy mogą być niezdefiniowane (undefined). Jednak lepiej (zgodnie z dokumentacją HTML) będzie tak:
  1. <p>
  2. <input type='radio' name='typg' id='typg_1' value='1' checked='checked'>
  3. <input type='radio' name='typg' id='typg_2' value='2'>
  4. </p>
  5. <p>
  6. <div id='d1'>
  7. </div>
  8. <div id='d2'>
  9. </div>
  10. </p>
  11. document.getElementById('d2').style.display = 'none';
  12. if(document.getElementById('typg_1').checked) {
  13. document.getElementById('d1').style.display = 'block';
  14. document.getElementById('d2').style.display = 'none';
  15. } else if(document.getElementById('typg_2').checked) {
  16. document.getElementById('d2').style.display = 'block';
  17. document.getElementById('d1').style.display = 'none';
  18. }
mari6274
Jest problem. Zawartość diva pojawia się po wybraniu opcji i odświeżeniu strony, a nie o to mi chodziło :/
kamil4u
A o co Ci chodziło? Tak napisałeś ten kod. Prawdopodobnie chodzi Ci o zmianę dynamiczną. W takim przypadku dodaj do checkbox zdarzenie onchange z funkcją, która zawiera to co w powyższych postach.
mari6274
O właśnie!! o to mi chodziło, bo próbowałem z funkcją onclick ale to mi nie pasowało. Sprawdzimy, dzięki wink.gif

Edit <----------------
Jednak nie widzę zbytniej różnicy pomiędzy onclick a onchange :/ myślałem, że to mi da wybór już na starcie.

Teraz mam taki kod:
  1. <p>
  2. <input onchange="zmiana('1')" type='radio' name='typg' id='typg_1' value='1' checked='checked'>Opcja 1
  3. <input onchange="zmiana('2')" type='radio' name='typg' id='typg_2' value='2'>Opcja 2
  4. </p>
  5. <p>
  6.  
  7. <div id='d1'>
  8.  
  9. </div>
  10.  
  11. <div id='d2'>
  12.  
  13. </div>
  14.  
  15. //document.getElementById('d2').style.display = 'none';
  16. function zmiana(wybor) {
  17. if(wybor == 1) {
  18. document.getElementById('d1').style.display = 'block';
  19. document.getElementById('d2').style.display = 'none';
  20. } else if(wybor == 2) {
  21. document.getElementById('d2').style.display = 'block';
  22. document.getElementById('d1').style.display = 'none';
  23. }
  24. }
  25. </script>
  26.  
  27. </p>


Bez skomentowanej linijki przy załadowaniu strony divy się na siebie nakładają, a z nią nie wyświetla się wgl drugi div. Pomijając już problemy po odświeźeniu strony..
kamil4u
Zapewne musisz wykorzystać zdarzenie onload
mari6274
Za funkcją dodałem jeszcze wywołanie funkcji z parametrem 1. I niby wszystko w porządku. Ale tylko w wypadku, gdy zamieniłem divy kolejnością. Ponieważ w tym drugim divie znajduje się skrypt z galerią jQuery Roundabout. Ta galeria ma jakieś problemy z wyświetlaniem się. Jeśli jest w pierwszym divie to działa, jesli w drugim to nie. Dlaczego??

Dodatkowo, jeszcze zależy mi na tym, by po wczytaniu strony pojawiał się standardowo 1. div a po odświeżeniu pozostawał aktualnie zaznaczony. Niestety na tym etapie tego nie ma :/
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.