• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Problem w przekazaniu zmiennych między funkcjami.

VPS Starter Arubacloud
0 głosów
434 wizyt
pytanie zadane 3 października 2018 w JavaScript przez Domeltr Początkujący (440 p.)

Cześć. Mam sporą przeszkodę na początku mojej przygody z js. Stworzyłem kod którego zadaniem jest na podstawie wprowadzonych danych, takich jak ilość godzin pracy i stawka godzinowa, wyświetlać na ekranie to ile się zarobiło. Funkcja ta będzie co sekundę odświeżać wysokość dniówki i wyświetlać na stronie internetowej. Niestety zasięg zmiennych funkcji pobierającej ogranicza się tylko do niej, za to funkcja obliczająca i wyświetlająca wynik ich nie pobiera. Bardzo proszę o dokładną odpowiedź jak rozwiązać mój problem, tak jak wspomniałem celem tego mini projektu jest nauka języka :) Poniżej wklejam cały mój kod, może ktoś pokusi się o code review, każda porada mile widziana! Weźcie tylko proszę pod uwagę że to moje początki z językiem i nie osądzajcie mnie zbyt mocno! :)

<!DOCTYPE html>
<html lang="pl">
<head>

	<meta charset="utf-8"/>
	<link rel="Stylesheet" type="text/css" href="style.css" />
	<script type="text/javascript">

function ilezarobiles()

{
	var stawka = document.getElementById("stawka").value;
	stawka=eval(stawka);                //pobranie stawki z formularza
	
	var godziny = document.getElementById("godziny").value;
	godziny=eval(godziny);              //pobranie ilosci godzin pracy z formularza
	
	var sekundy = godziny*3600;    //zamiana ilosci godzin pracy na ilosc sekund pracy
	
	var stawka_sek= stawka/3600;  //przelicza stawke na godzine na stawke na sekunde
	
	var wynik = 0;                          
	wynik=eval(wynik);                //deklaracja zmiennej wynik
	
	var minelo = 0;
	minelo=eval(minelo);             //deklaracja zmiennej minelo
	
	                   
					  					  
		
		
		wynik = wynik.toFixed(2);
		document.getElementById("test_wynikpo").innerHTML=wynik; //test po zmianie ilosci miejsc po przecinku
		
							   //testowe wypisanie wartosci zmiennych
					   document.getElementById("test_stawka").innerHTML=stawka;
					   document.getElementById("test_godziny").innerHTML=godziny;
					   document.getElementById("test_sekundy").innerHTML=sekundy;
					   document.getElementById("test_stawka_sek").innerHTML=stawka_sek;
					   document.getElementById("test_wynik").innerHTML=wynik;
					   document.getElementById("test_minelo").innerHTML=minelo;
		
}

var stawkasekundowadopetli =  getElementById("test_stawka_sek");
var ilesekundwykonywac =  getElementById("test_sekundy");
var wynikpetla = getElementById("test_wynik");

function petla() {
var stawkasekundowadopetli =  getElementById("test_stawka_sek");
var ilesekundwykonywac =  getElementById("test_sekundy");
var wynikpetla = getElementById("test_wynik");

do {
		wynikpetla = wynikpetla + stawkasekundowadopetli;
		minelo = minelo + 1;
		document.getElementById("wynik").innerHTML=wynik;
		window.setTimeout("ilezarobiles()",1000);
		}
		while (minelo != ilesekundwykonywac);

}

	</script>
</head>

<body style="background:grey">
<div id="content">
	<div id="formularz">
		<input type="number" id="stawka"> Stawka<br>
		<input type="number" id="godziny"> Godziny<br>
		<input type="submit" value="Sprawdź" onclick="ilezarobiles()">
		<input type="submit" value="petla" onclick="petla()">
	</div>
	
	<div>
	Ile zarobiles<div id="wynik"></div>
	</div>
</div>
	
	<div id="testy">
	<h2>Testy</h2>
		<div>Nazwa zmiennej - stawka: <div id="test_stawka"></div></div>
		<div>Nazwa zmiennej - godziny: <div id="test_godziny"></div></div>
		<div>Nazwa zmiennej - sekundy: <div id="test_sekundy"></div></div>
		<div>Nazwa zmiennej - stawka_sek: <div id="test_stawka_sek"></div></div>
		<div>Nazwa zmiennej - wynik: <div id="test_wynik"></div></div>
		<div>Nazwa zmiennej - minelo: <div id="test_minelo"></div></div>
		<div>Nazwa zmiennej - wynik po zmianie: <div id="test_wynikpo"></div></div>
	</div>
	
</body>
</html>

 

komentarz 3 października 2018 przez ScriptyChris Mędrzec (190,190 p.)

W jakim celu używasz eval?

komentarz 3 października 2018 przez adrian17 Ekspert (344,100 p.)
Inne boczne uwagi (bo prosiłeś o code review):

- .innerHTML nie jest do ustawiania tekstu

- na linii 55 próbujesz dodać elementy

Co do Twojego problemu... nie wystarczy, żeby `minelo` było globalne?

2 odpowiedzi

0 głosów
odpowiedź 4 października 2018 przez Domeltr Początkujący (440 p.)

JSHolic: szczerze mówiąc teraz nie pamiętam. Jest to kod odkopany po miesiącu, wtedy się poddałem w pisaniu go. Pamiętam że znalazłem radę w internecie żeby użyć eval, prawdopodobnie chodziło o możliwość wykonywania działań na zmiennych.

adrian17: czym powinienem zastąpić .innerHTML?

Nie do końca rozumiem na czym polega problem w linii 55, byłbym bardzo wdzięczny za wyjaśnienie :)

Czyli tak naprawdę wystarczyłoby wyciągnąć:
 

var minelo = 0;
    minelo=eval(minelo);

poza funkcję?

1
komentarz 4 października 2018 przez pablop76 VIP (123,060 p.)
edycja 4 października 2018 przez pablop76

Musisz zapoznać się z podstawami js.

1.Zasięg zmiennych. (Jeżeli deklarujesz lokalnie zmienną var minelo = 0; w funkcji ilezarobiles() to nie możesz z niej korzystać w funkcji petla()

2.Pobieranie elementów z drzewa DOM

var stawkasekundowadopetli =  getElementById("test_stawka_sek");
var ilesekundwykonywac =  getElementById("test_sekundy");
var wynikpetla = getElementById("test_wynik");

nie określa skąd pobierany jest element. Brakuje wskazania obiektu document.

3. innerHTML ustawia lub pobiera ZBIÓR zawartych w danym elemencie ZNACZNIKÓW razem z ich treścią.

Do wstawienia samej treści wystarczy textContent

4. Jeżeli tworzysz formularz to dlaczego nie korzystasz z tagu form?

0 głosów
odpowiedź 4 października 2018 przez Domeltr Początkujący (440 p.)

Napisałem skrypt od nowa, widząc jak dużo jest do poprawy i jak wiele zbędnych linijek się w nim znajduje. Dziękuję wam za rady, wszystko prawie że działa.

<!DOCTYPE html>
<head>
</head>
<body>
<script>
function pobierz() {
stawka = document.getElementById("stawka").value;
stawka=eval(stawka); //zmiana łańcucha na liczbę

godziny = document.getElementById("godziny").value;
godziny=eval(godziny); //zmiana łańcucha na liczbę

sekundy = godziny*3600;    //zamiana ilosci godzin pracy na ilosc sekund pracy
		
stawka_sek = stawka/3600;  //przelicza stawke na godzine na stawke na sekunde
stawka_sek=eval(stawka_sek);
minelo = 0;
minelo=eval(minelo);

wynik = 0;
wynik=eval(wynik);
}
function obliczenia() {
do {
		wynik = wynik + stawka_sek;
		minelo = minelo + 1;
		document.getElementById("wynik").textContent=wynik;
		window.setTimeout("obliczenia()",1000);
		}
		while (minelo != sekundy);

}

</script>
<div id="form">
<input type="number" id="stawka"> Stawka godzinowa
<input type="number" id="godziny"> ile godzin pracujesz?
<input type="submit" value="start" onclick="pobierz()">
<input type="submit" value="start" onclick="obliczenia()">
</div>
<div id="wynik"></div>





</body>

Jest jednak pewien problem z setTimeout. Skrypt działa bez opóźnień, przez co zacina przeglądarkę (klasyka) i zamiast wykonywać działanie co sekundę, robi to dużo szybciej, bez końca. Dodatkowo przypomniałem sobie w jakim celu użyty jest eval. Chodziło o możliwość wykonywania obliczeń na zmiennych, który to sposób znalazłem w internecie.

komentarz 4 października 2018 przez Grzegorz :> Dyskutant (8,050 p.)
Zamiast setTimeout spróbuj setInterval ;)
komentarz 4 października 2018 przez Grzegorz :> Dyskutant (8,050 p.)

Łe, w tej linijce z setTimeout zamiast

window.setTimeout("obliczenia()",1000);

daj:
 

window.setTimeout(obliczenia,1000);

 

komentarz 4 października 2018 przez Domeltr Początkujący (440 p.)
Niestety oba rozwiązania nic nie dały, problem pozostał

Podobne pytania

0 głosów
2 odpowiedzi 181 wizyt
0 głosów
2 odpowiedzi 2,967 wizyt
0 głosów
1 odpowiedź 473 wizyt

92,454 zapytań

141,263 odpowiedzi

319,099 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...