Sablon

[[oktatas:web:javascript|< JavaScript]] ====== JavaScript Feladatok ====== * **Szerző:** Sallai András * Copyright (c) 2019, Sallai András * Szerkesztve: 2019, 2024 * Licenc: [[https://creativecommons.org/licenses/by-sa/4.0/|CC Attribution-Share Alike 4.0 International]] * Web: https://szit.hu ===== Általános feladatok ===== ==== Feladat 0001 ==== Készítsen weblapot, amelynek tetején minidig a napszaknak megfelelő üdvözlet szerepel. Például 10:00-ig "Jó reggelt", Utána 18:00-ig "Jó napot". Utána "Jó estét". ===== Űrlapos feladatok ===== ==== Feladat 0051 ==== Készítsen egy űrlapot, ahol bekér egy e-mail címet. Az űrlapba beírt e-mail címet ellenőrizze, hogy valóban e-mail cím-e a beírt szöveg. ==== Feladat 0052 ==== Készítsen webalkalmazást, amely kiszámítja egy háromszög területét az alapból és a magasságból. ===== Hibára épülő feladatok ===== ==== Feladat 0101 ==== Az alábbiakban egy duplázó webes alkalmazást láthatunk JavaScript és CSS megoldással. A feladatban azonban nem működik a duplázás. Három hibát is rejt a feladat. Keresse meg a hibákat.





	
	Sablon
	
	


	
		Duplázó
		
		Készítsen weblapot, amely 
		tartalmazza a feladat leírását.
		A weblapon legyen egy beviteli mező,
		amely számokat vár.
		Legyen egy nyomógomb, amelyre kattintva,
		a beviteli mező tartalma megduplázódik.
		A duplázott érték egy div elemben jelenjen meg
		
		
			Szám:


var szam1Div = document.getElementById("szam1");
var duplaGomb = document.getElementById("duplaGomb");
var eredmenyDiv = document.getElementById("eredmeny");
var rejtGomb = document.getElementById("rejtGomb");

rejtGomb.onclick = function() {
	eredmenyDiv.style.display = "none";
};

duplaGomb.onclick = function() {
	
	eredmenyDiv.style.display = "block";
	
	var szam1Str = szam1Div;
	if(szam1Str.match("[^0-9]")) {
		alert("Nem várt karakter!");
	}else {
		var eredmeny = 2 * szam1Div.Value;
		eredmenyDiv.innerHTML = eredmeny;
	}
};


#eredmeny {
	background-color: navy;
	color: white;
	padding: 48px;
	border-radius: 10px;
	position: fixed;
	top: 50px;
	left: 40%;
	display: none;
	border-width: 2px;
	border-style: solid;
	
}

#container {
	background-color: navy;
	color: white;
	padding: 48px;
	border-radius: 10px;
	margin: 2% 10%;	
}

#container h1 {
	font-family: sans;
}