potrzebuje pomocy w naprawie tego skryptu

pytanie zadane 26 stycznia 2022 w HTML i CSS przez NightWish Nowicjusz (160 p.)

Problem wygląda tak ze mam błędnie napisany skrypt a nie wiem jak go naprawić, próbowałem kilka razy ale nic mi to nie dawało zostawiam wam ten skrypt którego używałem mam nadzieje ze komuś uda się go naprawić. Z góry dziękuje za pomoc.

<html>
	<head>
	<meta charset="UTF-8">


	</head>
	<body>

	<h1>KOŁO</h1>
	Podaj długość promienia: <input type="text" id="dlugosc">
	<br>

	<input id="pole" type="button" name="pole" value="Pole" >
	<input id="obwod" type="button" name="obwod" value="Obwod" >
	<div id='wynik'></div>


	<script type="text/javascript">
	const poleButton = document.querySelector('#pole');
	const obwodButton = document.querySelector('#obwod');
	const wynikDiv = document.querySelector('#wynik');

	poleButton.addEventListener('click', pole)
	obwodButton.addEventListener('click', obwod)

	function polekola(r){

	return Math.pow(Math.PI*r, 2);

	}

	function obwodkola(r){

	return 2Math.PIr;

	}

	</script>
	</body>
	</html>

komentarz 26 stycznia 2022 przez ScriptyChris Mędrzec (190,190 p.)

Proszę poprawić pytanie zgodnie z regulaminem (tytuł i opis tematu oraz tagi) i wstawić kod w odpowiednie bloczki.

2 odpowiedzi

odpowiedź 26 stycznia 2022 przez CubeStorm Pasjonat (15,020 p.)

No i masz rację, program nie działa i nie ma prawa działać. Polecenie takie jak:

poleButton.addEventListener('click', pole)

przypisuje wykonanie funkcji o nazwie pole na kliknięcie w element leżący w zmiennej poleButton, problem w tym, że ty nie masz żadnej funkcji o nazwie pole, a polekola.

Kolejny problem jest taki, że gdy już takowa funkcja miałaby się wykonać to masz w niej słówko kluczowe return, a takie polecenie po prostu zwraca nam liczbę, jeśli nie zapiszesz jej do żadnej zmiennej, lub nie wyświetlisz na ekranie to ona po prostu przepadnie. Musisz w niej zaimplementować wyświetlenie liczby w divie o id wynik.

odpowiedź 27 stycznia 2022 przez VBService Ekspert (253,340 p.)

Dodaj funkcję, która będzie wyświetlać wynik.

przykład

<html>
  <head>
    <meta charset="UTF-8">
  </head>
  <body>

    <h1>KOŁO</h1>
    Podaj długość promienia: <input type="text" id="dlugosc">
    <br />

    <input id="polekola" type="button" name="pole" value="Pole" >
    <input id="obwodkola" type="button" name="obwod" value="Obwod" >
    <br /><br />
    <div id='wynik'></div>


    <script type="text/javascript">
      const dlugoscInput = document.querySelector('#dlugosc'),
            poleButton   = document.querySelector('#polekola'),
            obwodButton  = document.querySelector('#obwodkola'),
            wynikDiv     = document.querySelector('#wynik');

      poleButton.addEventListener('click', function() { oblicz('pole'); });
      obwodButton.addEventListener('click', function() { oblicz('obwod'); });

      function oblicz(nazwa) {
        const r = parseInt(dlugoscInput.value.trim());
        let wynik;
        switch(nazwa) {
          case 'pole': wynik = 'Pole wynosi: ' + polekola(r); break;
          case 'obwod': wynik = 'Obwód wynosi: ' + obwodkola(r); break;  
        }
        wynikDiv.textContent = wynik;
      }

      function polekola(r) {      
        return Math.pow(Math.PI*r, 2);      
      }

      function obwodkola(r) {      
        return 2*Math.PI*r;      
      }
    </script>
  </body>
</html>