Javascript Hesap Makinesi Yapma Sorunu
Aşağıdaki kodlar ile hesap makinesi yapmaya çalışıyorum. Konsol'da veya tarayıcıda hata vermiyor ama sonuç da vermiyor. Ne yapmam lazım acaba?
<div id="sayi1" class="sayi1">
<input type="text">
</div>
<select class="islemisareti">
<option value="1">Toplama</option>
<option value="2">Çıkarma</option>
<option value="3">Çarpma</option>
<option value="4">Bölme</option>
</select>
<div id="sayi2" class="sayi2">
<input type="text">
</div>
<div id="esittir" class="esittir">
=
</div>
<div id="islemsonucu" class="islemsonucu">
</div>
<button class="buton" onclick="islemsonucugoster()">Cevapla</button>
<div id="dogru" class="dogru">
</div>
<div id="yanlis" class="yanlis">
</div>
<script>
function islemsonucugoster() {
var islemsonuc = document.getElementById("islemsonucu");
var sayi1 = parseInt(document.getElementById(sayi1));
var sayi2 = parseInt(document.getElementById(sayi2));
var secilendeger = document.getElementsByTagName(Option).value;
if(secilendeger == 1) {
islemsonuc = sayi1 + sayi2;
islemsonucu.innerHTML = islemsonuc;
} else if(secilendeger == 2) {
islemsonuc = sayi1 - sayi2;
islemsonucu.innerHTML = islemsonuc;
} else if(secilendeger == 3) {
islemsonuc = sayi1 * sayi2;
islemsonucu.innerHTML = islemsonuc;
} else if(secilendeger == 4) {
islemsonucu = sayi1 / sayi2;
islemsonucu.innerHTML = islemsonucu;
}
}
Kodunuzda çok fazla yazım yanlışı var. Aşağıdaki şekliyle sizinki arasındaki farkları inceleyebilirsiniz:
function islemsonucugoster() {
var islemsonuc = document.getElementById("islemsonucu");
// var sayi1 = parseInt(document.getElementById(sayi1));
// siz burada input'u değil, input'un kapsayıcısı olan div'i seçmeye çalışmışsınız.
// input'u seçmiş olsaydınız bile input'un value'sini değil direkt input elementinin kendisini seçmiş olacaktınız.
var sayi1 = parseInt(document.querySelector("#sayi1 > input").value);
// var sayi2 = parseInt(document.getElementById(sayi2));
// Burada da yine input'u değil kapsayıcısını seçmeye çalışmışsınız. sayi1 ile aynı.
var sayi2 = parseInt(document.querySelector("#sayi2 > input").value);
// document.getElementsByTagName(Option).value;
// Ama hangi option'un value'si? Seçilmiş olan option'a ulaşmak için select elementinin değerini almalısınız.
var secilendeger = document.querySelector(".islemisareti").value;
if(secilendeger == "1") {
islemsonuc = sayi1 + sayi2;
islemsonucu.innerHTML = islemsonuc;
} else if(secilendeger == "2") {
islemsonuc = sayi1 - sayi2;
islemsonucu.innerHTML = islemsonuc;
} else if(secilendeger == "3") {
islemsonuc = sayi1 * sayi2;
islemsonucu.innerHTML = islemsonuc;
} else if(secilendeger == "4") {
// islemsonucu = sayi1 / sayi2;
// "islemsonuc" yazmak yerine "islemsonucu" yazmışsınız.
islemsonuc = sayi1 / sayi2;
// islemsonucu.innerHTML = islemsonucu;
// burada da "islemsonuc" ve "islemsonucu" kelimelerini karıştırmışsınız.
islemsonucu.innerHTML = islemsonuc;
}
}