Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript] Obliczenia dynamiczne
Forum PHP.pl > Forum > Przedszkole
lubiemdziem
17.07.2012, 10:39:22
Witam, mam taki oto skrypt:

[HTML] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
  2. <html>
  3. <head>
  4. <meta http-equiv="content-type" content="text/html; charset=iso-8859-2" >
  5. <script type="text/javascript" src="http://eresa.pl/cc.js"></script>
  6. </head>
  7. <body>
  8.  
  9.     <form>
  10.         <input id="dane1" type="text" name="dane1" onkeyup="jeden(this.form)" maxlength="2" value="60">
  11.         <input id="dane2" type="text" name="dane2" onkeyup="dwa(this.form)" maxlength="9"  value="273742">
  12. <br />
  13.         <input id="dane11" type="text" name="dane11" onkeyup="piec(this.form)" maxlength="2" value="80">
  14.         <input id="dane12" type="text" name="dane12" onkeyup="szesc(this.form)" maxlength="9" value="1986068">
  15.     </form>
  16. &nbsp;
  17.  
  18.     <form>
  19.         <label>Input3: <input id="dane3"  name="wynik" type="text" onkeyup="trzy()" value="1712326"></label>
  20.     </form>
  21.  
  22. <script type="text/javascript">
  23. // część konfiguracyjna
  24. var stala=0.5;  //stala - mnoznik
  25. var input1=10000; //STAŁĄ WARTOŚĆ CHCĘ ZMIENIĆ NA WARTOŚĆ POKAZYWANĄ W INPUT3, który liczę ze wzoru: document.getElementById("dane3").value = parseFloat(document.getElementById("dane12").value) - parseFloat(document.getElementById("dane2").value);
  26.  
  27. // pozycje tabeli
  28. var pozycje= new Array(
  29.   [5,1,'Lemon',80],
  30.   [8,2,'Apple',100],
  31.   [11,3,'orange',200],
  32.   [15,3,'banana',300]
  33. );
  34. // pozycje do ukrywania - lista id rozdzielona kreskami (również na krańcach)
  35. var wyroznione= '|8|15|';
  36. var kolor= 'yellow';  //kolor wyróżnienia
  37.  
  38. //funkcje modyfikujace zawartosc
  39.  
  40. // przelicza pozycję poz
  41. function przelicz(poz)
  42. {
  43.   id= pozycje[poz][0];
  44.   L2= (pozycje[poz][3]==0? '' : Math.ceil(input1/pozycje[poz][3])); // obliczenie liczba2
  45.   document.getElementById('L2_'+id).innerHTML= L2;  // wstawienie L2 do kolumny
  46.   Inp2= document.getElementById('Inp2_'+id).value;  // pobranie zawartosci inputa
  47.   L4= Inp2*L2;  //obliczenie liczba4
  48.   document.getElementById('L4_'+id).innerHTML= L4;
  49.   //podstawienie liczba5 w zaleznosci od stanu checkboxa cb1
  50.   document.getElementById('L5_'+id).innerHTML= 
  51.     document.getElementById('cb1').checked? pozycje[poz][3]*stala : pozycje[poz][3];
  52. }
  53. // przelicza wszystkie pozycje
  54. function przelicz_wszystkie()
  55. {
  56.   for(i=0;i<pozycje.length;i++)
  57.     przelicz(i);
  58. }
  59.  
  60. //wyróznienie wybranych pozycji
  61. function wyroznij()
  62. {
  63.   for(i=0;i<pozycje.length;i++)
  64.  
  65.     if (wyroznione.indexOf('|'+pozycje[i][0]+'|')>=0)  //czy pozycja o danym id jest w zmiennej wyróżnione
  66.  
  67.     {
  68.       if (document.getElementById('cb2').checked)
  69.         document.getElementById('tr'+pozycje[i][0]).bgColor= kolor;
  70.       else
  71.         document.getElementById('tr'+pozycje[i][0]).bgColor= '';
  72.     } 
  73. } 
  74. //ukrywanie wybranych pozycji
  75. function ukryj()
  76. {
  77.   for(i=0;i<pozycje.length;i++)
  78.     if (wyroznione.indexOf('|'+pozycje[i][0]+'|')>=0)  //czy pozycja o danym id jest w zmiennej wyróżnione
  79.     {
  80.       if (document.getElementById('cb3').checked)
  81.         document.getElementById('tr'+pozycje[i][0]).style.display= 'none';
  82.       else
  83.         document.getElementById('tr'+pozycje[i][0]).style.display= '';
  84.     } 
  85. } 
  86. </script>
  87.  
  88. <input type="checkbox" id="cb1" onclick="przelicz_wszystkie();"> <label >przemnóż</label> 
  89. <input type="checkbox" id="cb2" onclick="wyroznij();"> <label >wyróżnij</label> 
  90. <input type="checkbox" id="cb3" onclick="ukryj();"> <label >ukryj</label> 
  91. <table border="1" cellpadding="3" >
  92. <tr><th>Nr</th><th style="display:none;">ID</th><th>PRZEDMIOT</th><th>LICZBA</th><th>LICZBA2</th><th>LICZBA3</th><th>LICZBA4</th><th>LICZBA5</th></tr>
  93.  
  94. <script type="text/javascript">
  95. // wypelnienie tabeli wg danych w tablicy pozycje
  96. for(i=0;i<pozycje.length;i++)
  97. {
  98.   p= pozycje[i];
  99.   document.write('<tr id="tr'+p[0]+'"><td style="display:none;">'+p[0]+'</td><td>'+p[1]+'</td><td>'+p[2]+'</td><td>'+p[3]+'</td>');//kolumny stale
  100.   document.write('<td id="L2_'+p[0]+'"></td>');//liczba 2
  101.   document.write('<td><input type="text" size="5" id="Inp2_'+p[0]+'" onkeyup="przelicz('+i+')"></td>');//input 2
  102.   document.write('<td id="L4_'+p[0]+'"></td><td id="L5_'+p[0]+'"></td></tr>');//liczba 4,5
  103. }
  104. przelicz_wszystkie(); // pierwsze przeliczenie wszystkich pozycji
  105. </script>
  106.  
  107. </table>
  108. </body>
  109. </html>
[HTML] pobierz, plaintext


I w linii 25 chcę zmienić wartość stałą na wartość z input3. Wydaje mi się że odpowiedzialne są linie 25 i 100.
Pozdrawiam
piotrex41
17.07.2012, 10:53:04
Nie rozumiem problemu. Po prostu podstaw pod zmienną wynik działania, którego wzór podałeś w komentarzu. Polecam zdebugować czy dobrze się wylicza używając metody alert().
lubiemdziem
17.07.2012, 10:57:19
Wtedy nie działa dynamicznie. Wynik pojawia się od razu po załadowaniu strony - a później gdy ruszam input3 nic się nie dzieje
piotrex41
17.07.2012, 10:58:57
No bo jak ma liczyć, skoro nie wprowadzasz danej? Najpierw musisz przekazać wartość z inputa i dopiero policzy...

U mnie poszło bez problemu:
Kod
<form>
<label>Input3: <input id="dane3"  name="wynik" type="text" onkeyup="trzy()"></label>
</form>

<script type="text/javascript">
// część konfiguracyjna
var stala=0.5;  //stala - mnoznik
var input1= document.getElementById("dane3").value = parseFloat(document.getElementById("dane12").value) - parseFloat(document.getElementById("dane2").value);


Jak zmieniam wartości inputów dane12 i dane2 to wartość w inpucie dane3 się zmienia dynamicznie.
lubiemdziem
17.07.2012, 11:09:25
To nadal nie to, trochę nie dopracowałem tematu ale chodziło mi o kolumnę LICZBA2

edit: przeczytałem pierwszy post jeszcze raz i chyba byłem zamyślony pisząc go ;P
piotrex41
17.07.2012, 11:12:45
To opisz dokładnie o co Ci chodzi, bo piszesz, a jak podałem Ci odpowiedź to nagle nie o to Ci chodzi. Opisz dokładnie problem, to spróbuję pomóc.
lubiemdziem
17.07.2012, 11:17:48
Już już , sorry biggrin.gif

Linia 25 wygląda następująco:

var input1=10000;

Jak widać jest przypisana stała wartość. Oddziaływuje ona na kolumnę LICZBA2.

Moim celem jest poprawienie skryptu, tak, że zamiast input1=10000; wstawiam dynamiczną wartość z inputa3. Czyli: gdy zmieniam cokolwiek w inputach wyżej (input3 to ich podsumowanie) to kolumna LICZBA2 powinna obliczać nową wartość dynamicznie.

Teraz już jasne? wink.gif

EDIT:

i tu jeszcze dodam: Odpowiedzialne za to są linie 25 i 100. Trzeba może dodać onkeyup i poprawić funkcję przelicz? Nie wiem, dlatego tu się pojawiłem z problemem
piotrex41
17.07.2012, 11:19:43
Nie. Liczba2 teraz jest dynamiczna? Jeśli tak, to skąd bierze wartość? Jakim wzorem chcesz liczyć wartość inputa1 i co ma być z niego przekazywane do liczba2? Opisz krok po kroku.
lubiemdziem
17.07.2012, 11:33:16
Wiesz, to nie jest skrypt mojego autorstwa i nie ogarniam javascript

Liczba2 liczona jest w wierszu 44

dostałem taką odpowiedź:

W tym miejscu są deklaracje, które wykonują się tylko raz przy otwarciu strony.
Żeby zmieniało się dynamicznie, to do inputów trzeba dorobić obsługe zdarzenia onchange albo onkeyup jak w linii 85.
Natomiast to wyrażenie z 25 najlepiej dodać do funkcji przelicz(), gdzieś przed pierwszym użyciem w niej input1

Może to pomoże?
wNogachSpisz
17.07.2012, 11:35:54
Debugowanie przy pomocy alertów jest dobre gdy dopiero zaczynasz zabawę z JavaScript, nie czujesz się w nim swobodnie i nie rozumiesz jak mogą pomóc debuger i konsola. W chwili gdy masz już pojęcie co to jest DOM, potrafisz tworzyć funkcje, obiekty, klasy a nawet closures (nie wiem jak to słówko się tłumaczy), warto poświęcić trochę czasu i zorganizować sobie środowisko developerskie. Polecam Opera Dragonfly lub trochę gorszy Mozilla Firebug.
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.