Nie ukazuje się wynik funkcji

pytanie zadane 23 kwietnia 2021 w HTML i CSS przez MajsterXCF Nowicjusz (130 p.)

Mam zadanie "Należy wykonać witrynę z formularzem (tag FORM) zawierającym: 2 pola edycyjne liczbowe, lista rozwijana z opcjami + - * /, przycisk Oblicz.
Działanie witryny i skryptu: po kliknięciu przycisku wyświetla się wynik operacji wybranej z listy wykonanej na dwóch liczbach z pól edycyjnych. Na razie nie trzeba robić sprawdzenia danych w formularzu. Wynik powinien wyświetlać się w zielonej ramce poniżej formularza."

Napisałem poniższy kod, aczkolwiek nie wyświetla mi się wynik. Mógłby ktoś zerknąć i napisać co mam źle i co mam zrobić by to działało? Z góry dziękuję za odpowiedź

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

<head> 
</head>

<body> 

<form>
<select id="Dzialania">
  <option value="Dodawanie">Dodawanie</option>
  <option value="Odejmowanie">Odejmowanie</option>
  <option value="Mnożenie">Mnożenie</option>
  <option value="Dzielenie">Dzielenie</option>
</select> <br> <br>



</form>

<script>
 
 function WynikDzialania()
       {
	 var ddl = document.getElementById("Dzialania");
     var WybranaWartosc = ddl.options[ddl.selectedIndex].value;
     if (WybranaWartosc == "Dodawanie")
   {
     var dod1=document.getElementById("Liczba1").value;
     var dod2=document.getElementById("Liczba2").value;
     var dodawanie=0;
     var dodawanie=Number(dod1)+Number(dod2);
     document.write("koniec").innerHTML="Wynik:"+ dodawanie;
     }
     else
     {
	 if (WybranaWartosc == "Odejmowanie")
	 {
     var od1=document.getElementById("Liczba1").value;
     var od2=document.getElementById("Liczba2").value;
     var odejmowanie=0;
     var odejmowanie=od1-od2;
     document.getElementById("koniec").innerHTML="Wynik:"+odejmowanie;
     }
     else
     {
	 if (WybranaWartosc == "Mnożenie")
	 {
     var mno1=document.getElementById("Liczba1").value;
     var mno2=document.getElementById("Liczba2").value;
     var mnozenie=0;
     var mnozenie=mno1*mno2;
     document.getElementById("koniec").innerHTML= "Wynik:" + mnozenie;
     }
     else
     {
	 if (WybranaWartosc == "Dzielenie")
	 {
     var dz1=document.getElementById("Liczba1").value;
     var dz2=document.getElementById("Liczba2").value;
     var dzielenie=0;
      
     if (dz2==0)
     {
     document.getElementById("koniec").innerHTML="Nie dzieli się przez 0!";
     }
     else
     {
     var dzielenie=dz1/dz2;
     document.getElementById("koniec").innerHTML= "Wynik:" + dzielenie;
     }
     }
      
</script>
<input type="number" id="Liczba1" />
<input type="number" id="Liczba2"/>
<br></br>
<button onclick="WynikDzialania()">Oblicz</button>
<br></br>
Wynik
<br></br>
<div id="koniec"></div>

</body>

</html>

1 odpowiedź

odpowiedź 23 kwietnia 2021 przez SzkolnyAdmin Szeryf (86,360 p.)

Np. devtoolsy pokazują taki komunikat

Uncaught SyntaxError: missing } in compound statement index.html:75 note: { opened at line 57, column 5

Ogólnie masz kaszanę z klamrami.

co oznacza zapis document.write("koniec").innerHTML="Wynik:"+ dodawanie; ???

komentarz 23 kwietnia 2021 przez MajsterXCF Nowicjusz (130 p.)

A eksperymentowałem z tym writem, ale już to zmieniłem

A o devtoolsach nic nie wiem bo dopiero zaczynam z js (pozdro z technikum)

A co jest z tymi klamrami poza tym co napisałeś?

komentarz 23 kwietnia 2021 przez SzkolnyAdmin Szeryf (86,360 p.)

Nie są podomykane klamry, niepotrzebne jest ci zagnieżdżenie else, niepotrzebnie tworzysz nowe zmienne do pobierania liczb. Moja propozycja skryptu:

function WynikDzialania() {
	var ddl = document.getElementById("Dzialania");
	var WybranaWartosc = ddl.options[ddl.selectedIndex].value;
	 
	var l1 = Number(document.getElementById("Liczba1").value);
	var l2 = Number(document.getElementById("Liczba2").value);
     
	if (WybranaWartosc == "Dodawanie") document.getElementById("koniec").innerHTML="Wynik:"+ (l1+l2);
    
	if (WybranaWartosc == "Odejmowanie") document.getElementById("koniec").innerHTML="Wynik:"+ (l1-l2);
    
	if (WybranaWartosc == "Mnożenie") document.getElementById("koniec").innerHTML="Wynik:"+ (l1*l2);

	if (WybranaWartosc == "Dzielenie") {
		if (l2==0) document.getElementById("koniec").innerHTML="Nie dzieli się przez 0!";
    else document.getElementById("koniec").innerHTML="Wynik:"+ (l1/l2);
	}
}