Drukowana wersja tematu

Kliknij tu, aby zobaczyć temat w orginalnym formacie

Forum PHP.pl _ JavaScript _ Tabliczka mnożenia - wyświetlanie czynników po najechaniu na komórkę tabeli

Napisany przez: QeRICKpl 27.01.2018, 16:10:36

Witam,
mam problem i nie wiem jak zabrać się do tego zadania. Mianowicie, mam za pomocą PHP + JS stworzyć tabele mnożenia, w której po najechaniu na daną komórkę, wyświetlą się czynniki danej liczby.
Sam kod tworzący tabelę wygląda u mnie następująco:

  1. http://www.php.net/echo '<table border=1>';
  2. for($a=1; $a <=10; $a++){
  3. http://www.php.net/echo '<tr>';
  4. for($b=1; $b<=10; $b++){
  5. if($a==1 || $b==1)
  6. http://www.php.net/echo '<td bgcolor="green">'.$a*$b.'</td>';
  7. else
  8. http://www.php.net/echo '<td>'.$a*$b.'</td>';
  9. }
  10. http://www.php.net/echo '</tr>';
  11. }
  12. http://www.php.net/echo '</table>';


I tu moje pytanie. Bo rozumiem, żeby wykonać to zadanie powinienem skorzystać z funkcji onmouseover w JS. Ale jak powinien wyglądać kod w JS, żebym otrzymał zamierzony efekt?
Pozdrawiam i liczę na pomoc!

Napisany przez: markuz 27.01.2018, 19:33:25

A próbowałeś w jakiś sposób go dodać?

  1. <div onmouseover="alert(1)">abc</div>

Napisany przez: trueblue 27.01.2018, 19:50:09

https://jsfiddle.net/nq3whn1k/

Napisany przez: QeRICKpl 27.01.2018, 20:30:23

TAk, tylko potem nie potrafiłem tak tego napisać, żeby zmienna z php była odczytywana przez js.

A co do linku, to właśnie nie mogę użyć css, wszystko ma opierać się tylko na js i php

W sumie to tak jakoś wygląda cały mój kod, tylko nie tak jak pisałem, nie potrafię zrobić taka, żeby js widział zmienne php.

  1. <http://december.com/html/4/element/head.html>
  2. <http://december.com/html/4/element/meta.html charset="UTF-8">
  3. <http://december.com/html/4/element/script.html type="text/javascript">
  4.  
  5. function onmouseoverHandler()
  6.  
  7. {
  8. var a_js = $a_php;
  9. var b_js = $b_php;
  10. alert(a + ' x ' + b);
  11.  
  12. }
  13.  
  14. </http://december.com/html/4/element/script.html>
  15. </http://december.com/html/4/element/head.html>
  16.  
  17. <http://december.com/html/4/element/body.html>
  18. <?php
  19. echo '<table border=1>';
  20. for($a=1; $a <=10; $a++){
  21. echo '<tr>';
  22. for($b=1; $b<=10; $b++){
  23. if($a==1 || $b==1)
  24. echo '<td bgcolor="green" onmouseover="onmouseoverHandler();">'.$a*$b.'</http://december.com/html/4/element/td.html>';
  25. else
  26. echo '<http://december.com/html/4/element/td.html onmouseover="onmouseoverHandler();">'.$a*$b.'</http://december.com/html/4/element/td.html>';
  27. }
  28. echo '</http://december.com/html/4/element/tr.html>';
  29. }
  30. echo '</http://december.com/html/4/element/table.html>';
  31.  
  32. ?>
  33.  
  34.  
  35.  
  36. </http://december.com/html/4/element/body.html>

Napisany przez: markuz 27.01.2018, 20:43:49

https://jsfiddle.net/gden6c0z/

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)