Hej,
od kilku dni uczę się JS, jestem totalnie zielony i znam tylko podstawy css i html-a. W każdym razie próbowałem zrobić ćwiczenie: stworzyć aplikację, która po wpisaniu liczby w pole formularza i kliknięciu przycisku zwróci komunikat, czy dana liczba jest dodatnia czy ujemna bądź wynosi 0. Z tym nie miałem większego problemu, ale spróbowalem sobie zadanie utrudnić i chciałem zrobić tak, żeby informacja zwrotna pojawiała się w tym samym polu formularza, a jednocześnie żeby wszystkie wpisane liczby pojawiały się na liście pod formularzem. Natrafiłem jednak na problem: po wyświetleniu się komunikatu np "liczba dodatnia" i ponownym kliknięciu oblicz fraza "liczba dodatnia" z formularza też wędrowała na listę, a tego nie chciałem. Jedyne co wymyśliłem to umieszczenie kodu dopisywania tej liczby pod każdym z warunków funkcji, ale czuję, że da się to zrobić jakoś krócej. Czy jest sposób, żeby ten skrypt tworzenia nowego elementu
w divie zapisać raz i odnosić się do niej skrótem? Bez powtarzania 3 razy?
Przepraszam za lekki bełkot, ale chciałem możliwie dokładnie opisać mój dylemat.
Poniżej kod, z góry dziękuję za pomoc.
<!DOCTYPE html>
<html>
<head>
<title>Jaka to liczba?</title>
</head>
<body>
<input type="text" name="liczba" id="liczba">
<button onclick="oblicz()" id="przycisk">Oblicz</button>
<div id="div1"></div>
<script>
function newPara() {}
function oblicz() {
var num = document.getElementById("liczba").value;
if(num > 0) {
var para = document.createElement("p");
var node = document.createTextNode(num);
para.appendChild(node);
var element = document.getElementById("div1");
element.appendChild(para);
liczba.value = "liczba dodatnia";
}
if(num == 0) {
var para = document.createElement("p");
var node = document.createTextNode(num);
para.appendChild(node);
var element = document.getElementById("div1");
element.appendChild(para);
liczba.value = 0;
}
if (num < 0) {
var para = document.createElement("p");
var node = document.createTextNode(num);
para.appendChild(node);
var element = document.getElementById("div1");
element.appendChild(para);
liczba.value = "liczba ujemna";
}
}
</script>
</body>
</html>