addEventListener - dziwne zachowanie [JS]

0 
<!DOCTYPE html>
<html lang="pl">
	<head>
		<title>CW.2 - ZALENT</title>
		<meta charset="utf-8">
		<script type="text/javascript" src="script.js"></script>
	</head>
	<body>
		<input type="text" placeholder="mniejsza liczba" id="ml" />
		<input type="text" placeholder="większa liczba" id="wl" />
		<input type="submit" value="Click Me!" id="button"/>
		<div id="info"></div>
	</body>
</html>

function buildContent() {
	var liczba1 = document.getElementById("ml").value;
	var liczba2 = document.getElementById("wl").value;
	var button = document.getElementById("button");
	var tab = "";
	
	button.addEventListener("click", function() {		
			for (i=liczba1; i<liczba2; i++) {
				tab = tab + i + " ";
			}
			document.getElementById("info").innerHTML = tab;
		}
	);
}
window.addEventListener("DOMContentLoaded", buildContent);

Program udało mi się parę razy wywołać, sam nie wiem jak. Teoretycznie wszystko było dobrze, wyświetlały się liczby z określonego w inputach zakresu. Po odświeżeniu strony przeglądarka nie usuwała wartości z pamięci. Zdaje że układ procedur jest niewłaściwy, czegoś mi nie wczytuje...

0

Pobierasz wartośći z pól tekstowych na początku po załadowaniu strony, kiedy są puste. Powininieś to zrobić po naciśnięciu przycisku

0

Okej problem opanowany:

var button = document.getElementById("button");
var info = document.getElementById("info");

function start() {
	var liczba1 = Number(document.getElementById("ml").value);
	var liczba2 = Number(document.getElementById("wl").value);
	var tab = "";		
	for (var i=liczba1+1; i<liczba2; i++) {
		tab = tab + i + " ";
	}
		info.innerHTML = tab;
}	
button.addEventListener("click", start);

Dalej mnie jednak zastanawia jak dodać do buttona, kolejne zdarzenie.

0
Pangeon napisał(a):

Dalej mnie jednak zastanawia jak dodać do buttona, kolejne zdarzenie.

Tak samo, jak pierwsze: button.addEventListener("anotherEvent", anotherHandlerFunction);.

0

Albo

button.addEventListener("click", function () {
    funkcja1();
    funkcja2();
});

Możesz w zgrabniejszy sposób podłączać wiele funkcji pod to samo zdarzenie.

1 użytkowników online, w tym zalogowanych: 0, gości: 1