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

js input undefined

VPS Starter Arubacloud
0 głosów
191 wizyt
pytanie zadane 11 lipca 2020 w JavaScript przez lujasjeden Użytkownik (860 p.)
zmienione kategorie 11 lipca 2020 przez Arkadiusz Waluk

To jest program, który pobiera 2 liczby od uzytkownika i wypisuje wszystkie liczby z przedzialu tych liczb.

<!DOCTYPE html>
<html lang="pl">
<head>
	<meta charset="utf-8">
	
	<script type="text/javascript">
		function wypisz()
		{
			var liczba1 = document.getElementById("pole1").value
			var liczba2 = document.getElementById("pole2").value
			var napis = "";
			
			if (liczba1>liczba2) napis="Liczba1 nie moze byc wieksza niz Liczba2";
			else if 
		
			else
			{
				for (i=liczba1; i<=liczba2; i++)
				{
					napis = napis + i + " ";
				}
			}
			document.getElementById("wynik").innerHTML = napis;
			
		}
	</script>
</head>
<body>
	<input type="text" id="pole1" />
	<input type="text"id="pole2"  />
	<input type="submit" value="pokaz" onclick="wypisz()" />
	<div id="wynik"></div>
</body>
</html>

 

Mam zabezpieczenie zeby liczba1 nie byla wieksza od liczba2 i chce jeszcze zabezpieczenie na wpisywanie liter probowalem tak:

else if (typeof liczba1!='number' || typeof liczba2!='number) napis="To nie liczby";

Ale liczba1 i liczba2 pozostaja undefined nawet jak wpisze sie jakies liczby w ich miejsca. Jak to rozwiazac najlepiej? Dlaczego to pozostaje undefined a nie zmienia sie w number albo w string jak sie wpisze litery?

3 odpowiedzi

0 głosów
odpowiedź 11 lipca 2020 przez creend Gaduła (4,700 p.)

1. Zmień kategorie wpisu z C i C++  na JavaScript

2. Dane z input[type=text] zwracają jak sama nazwa mówi text, czyli string. Więc else if (typeof liczba1!='number' || typeof liczba2!='number) Zawsze się wykona. Przy poborze danych sparsuj je na inta funkcją parseInt lub znakiem +:

var liczba1 = parseInt(document.getElementById("pole1").value)
var liczba2 = parseInt(document.getElementById("pole2").value)
var liczba1 = +document.getElementById("pole1").value
var liczba2 = +document.getElementById("pole2").value

 

komentarz 11 lipca 2020 przez creend Gaduła (4,700 p.)

Jeżeli to zrobisz if sprawdzający czy podane dane to liczby się zmieni na :

else if ((!liczba1 && liczba1 != 0) || (!liczba2 && liczba2 != 0)) napis = "To nie liczby";

To z powodu, że jeśli sparsujesz na inta string 'naprzyklad' to będzie w zmiennej przechwywana wartość NaN a jej typeof wynosi 'number'

komentarz 12 lipca 2020 przez lujasjeden Użytkownik (860 p.)
edycja 12 lipca 2020 przez lujasjeden

Nie rozumiem tego warunku co napisales i w sumie nie zadzialalo, ale zrobilem na 2 inne sposoby jeden dostalem w odpowiedzi tu na forum pod innym postem a drugi wzialem twoja rade z parseInt i inny warunek. Kody:

<!DOCTYPE html>
<html lang="pl">
<head>
	<meta charset="utf-8">
	
	<script type="text/javascript">
		function wypisz()
		{
			var liczba1 = document.getElementById("pole1").value *1
			var liczba2 = document.getElementById("pole2").value *1
			var napis = "";
		
			if (liczba2>=liczba1)
			{
				for (i=liczba1; i<=liczba2; i++)
				{
					napis = napis + i + " ";
				}
			}
			else if (liczba1>=liczba2)
			{
				for (i=liczba1; i>=liczba2; i--)
				{
					napis = napis + i + " ";
				}
			}
			else if (isNaN(liczba1)) 
			{
                napis="Wartość z pola Liczba1 nie jest liczbą";
			}
			else if (isNaN(liczba2))
			{
				napis="Wartość z pola Liczba2 nie jest liczbą";
			}
			document.getElementById("wynik").innerHTML = napis;
			
		}
	</script>
</head>
<body>
	<input type="text" id="pole1" />
	<input type="text"id="pole2"  />
	<input type="submit" value="pokaz" onclick="wypisz()" />
	<div id="wynik"></div>
</body>
</html>

 

<!DOCTYPE html>
<html lang="pl">
<head>
	<meta charset="utf-8">
	
	<script type="text/javascript">
		function wypisz()
		{
			var liczba1 = parseInt(document.getElementById("pole1").value)
			var liczba2 = parseInt(document.getElementById("pole2").value)
			var napis = "";
		
			if (liczba2>=liczba1)
			{
				for (i=liczba1; i<=liczba2; i++)
				{
					napis = napis + i + " ";
				}
			}
			else if (liczba1>=liczba2)
			{
				for (i=liczba1; i>=liczba2; i--)
				{
					napis = napis + i + " ";
				}
			}
			else if (Number.isInteger(liczba1)==false)
			{
				napis="Wartość w polu liczba1 nie jest liczbą całkowitą";
			}
			else if (Number.isInteger(liczba2)==false)
			{
				napis="Wartość w polu liczba2 nie jest liczbą całkowitą";
			}
			document.getElementById("wynik").innerHTML = napis;
			
		}
	</script>
</head>
<body>
	<input type="text" id="pole1" />
	<input type="text"id="pole2"  />
	<input type="submit" value="pokaz" onclick="wypisz()" />
	<div id="wynik"></div>
</body>
</html>

Dzieki za pomoc :D

0 głosów
odpowiedź 13 lipca 2020 przez Ilya Dimow Obywatel (1,240 p.)

Możesz sprawdzać przez REGEX 

/^-?\d+\.?\d*$/.test(liczba1) // dla wszystkich liczb
/^-?\d+$/.test(liczba) // tylko dla int

na przykład (na podstawie twojego kodu):
 

function stwórzNapis() {
  var liczba1 = document.getElementById("pole1").value;
  var liczba2 = document.getElementById("pole2").value;
  var napis = "";
  if (!/^-?\d+\.?\d*$/.test(liczba1)) {
    return "Wartość z pola Liczba1 nie jest liczbą";
  }

  if (!/^-?\d+\.?\d*$/.test(liczba2)) {
    return "Wartość z pola Liczba2 nie jest liczbą";
  }

  liczba1 = Number(liczba1);
  liczba2 = Number(liczba2);
  if (liczba2 >= liczba1) {
    for (i = liczba1; i <= liczba2; i++) {
      napis = napis + i + " ";
    }
  } else {
    for (i = liczba1; i >= liczba2; i--) {
      napis = napis + i + " ";
    }
  }
  return napis;
}

function wypisz() {
  document.getElementById("wynik").innerHTML = dajTekst();
}

 

komentarz 13 lipca 2020 przez ScriptyChris Mędrzec (190,190 p.)

Po co bawić się RegExpem, skoro liczbę całkowitą można sprawdzić metodą Number.isInteger?

–1 głos
odpowiedź 11 lipca 2020 przez Dani3l Bywalec (2,160 p.)
No bo musisz dać tagi `<script>` na koniec tagu `<body>` albo stworzyć nowy plik i użyć <script src ='nazwa.js'> na końcu body lub w tagu `<head>` z atrybutem `defer` - <srcipt src ='nazwa.js' defer>. Bo teraz to tak jakby pobierasz te elementy zanim one się zrenderują.
1
komentarz 11 lipca 2020 przez creend Gaduła (4,700 p.)
Masz po części rację lecz kod JS wykonuje się dopiero po kliknięci buttona, czyli po załadowaniu HTML'a więc tu nie ma błędu

Podobne pytania

0 głosów
1 odpowiedź 84 wizyt
pytanie zadane 24 lutego 2020 w JavaScript przez Grzegorz Mikina Dyskutant (8,060 p.)
0 głosów
1 odpowiedź 137 wizyt
pytanie zadane 8 września 2018 w JavaScript przez vneb Początkujący (490 p.)
0 głosów
0 odpowiedzi 106 wizyt
pytanie zadane 7 grudnia 2020 w JavaScript przez mi-20 Stary wyjadacz (13,190 p.)

92,452 zapytań

141,262 odpowiedzi

319,085 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!

...