Javascript İle İki sayıyı toplayan program

  • Konbuyu başlatan Konbuyu başlatan Anonymous
  • Başlangıç tarihi Başlangıç tarihi
Kodla Büyü
Sabit değerler ile toplama işlemi,
Değişen değerler ile toplama işlemi,
Formatlı çıkış işlemi yaparak toplama işlemi,
Formatlı giriş işlemi yaparak toplama işlemi,
Girişlerin Boş Olup Olmadığını Kontrol Ederek İşlem Yapma,
Sadece sayısal değerlerin girişine izin vererek işlem yapma,
Sadece sayıların girişine izin verme
 
Javascript terminal(client) tabanlı bir script dilidir. Sunucuların yükünü azaltmak amacıyla tasarlanmıştır. Bu örneğimizde iki sayının toplamının nasıl yapılacağı anlatılacaktır. Bir programlama dilini en iyi öğrenmenin yolu, işlemleri basitten zora doğru yapmaktır. Öncelikle probleme ait analiz işlemlerini, algoritmayı ve istenirse akış şemasını yapmalıyız.
Toplama işlemini gerçekleştirmeye çalışalım.
Sabit değerler ile toplama işlemi
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script language="javascript" type="text/javascript">
function topla()
{
// Statik Toplama
var a = 3;
var b = 4;
var c;
c = a + b;
alert(c);
}
</script>
</head>
<body>
<script language="javascript" type="text/javascript">
topla();
</script>
</body>
</html>
Değişen değerler ile toplama işlemi
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script language="javascript" type="text/javascript">
function topla()
{
// Dinamik Toplama
var a = prompt("1.sayıyı giriniz");
var b = prompt("2.sayıyı giriniz");
var c;
c = Number(a) + Number(b);
alert(c);
}
</script>
</head>
<body>
<script language="javascript" type="text/javascript">
topla();
</script>
</body>
</html>
Formatlı çıkış işlemi yaparak toplama işlemi
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script language="javascript" type="text/javascript">
function topla()
{
// Çıktıyı Formatlı Biçimde Gösterme
var a = prompt("1.sayıyı giriniz");
var b = prompt("2.sayıyı giriniz");
var c;
c = Number(a) + Number(b);
document.write(a + " + " + b + " = " + c);

}
</script>
</head>
<body>
A Sayısını Giriniz :<input id="txtA" type="text" /><br />
B Sayısını Giriniz :<input id="txtB" type="text" /><br />
<input id="btnTopla" type="button"
value="Topla" />
<script language="javascript" type="text/javascript">
topla();
</script>
</body>
</html>
Formatlı giriş işlemi yaparak toplama işlemi
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script language="javascript" type="text/javascript">
function topla()
{
// Girdiyi Formatlı Biçimde Gösterme
var a = document.getElementById("txtA").value;
var b = document.getElementById("txtB").value;
var c;
c = Number(a) + Number(b);
document.getElementById("txtC").value = c;
}
</script>
</head>
<body>
A Sayısını Giriniz : <input id="txtA" type="text" /><br />
B Sayısını Giriniz : <input id="txtB" type="text" /><br />
<input id="btnTopla" type="button"
value="Topla" onclick="topla()" /><br />
Toplama İşlemi : <input id="txtC" type="text" />
</body>
</html>
Girişlerin Boş Olup Olmadığını Kontrol Ederek İşlem Yapma
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script language="javascript" type="text/javascript">
function topla()
{
// Girişlerin Boş Olup Olmadığını Kontrol Ederek İşlem Yapma
var a = document.getElementById("txtA").value;
if (a == "")
hata1.innerHTML = "a sayısını giriniz";
else
hata1.innerHTML = "";
var b = document.getElementById("txtB").value;
if (b == "")
hata2.innerHTML = "b sayısını giriniz";
else
hata2.innerHTML = "";
var c;

if (Number(a)!="" && Number(b)!="")
{
c = Number(a) + Number(b);
txtC.value = c;
}
}
</script>
</head>
<body>
A Sayısını Giriniz : <input id="txtA" type="text" /><span id="hata1"></span><br />
B Sayısını Giriniz : <input id="txtB" type="text" /><span id="hata2"></span><br />
<input id="btnTopla" type="button"
value="Topla" onclick="topla()" /><br />
Toplama İşlemi : <input id="txtC" type="text" />
</body>
</html>
Sadece sayısal değerlerin girişine izin vererek işlem yapma
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script language="javascript" type="text/javascript">
function topla()
{
var a = document.getElementById("txtA").value;

if (a == "")
hata1.innerHTML = "a sayısını giriniz";
else if (isNaN(parseInt(a)))
hata1.innerHTML = "Lütfen Sayısal Değer Girişi Yapınız";
else
hata1.innerHTML = "";

var b = document.getElementById("txtB").value;

if (b == "")
hata2.innerHTML = "b sayısını giriniz";
else if (isNaN(parseInt(b)))
hata2.innerHTML = "Lütfen Sayısal Değer Girişi Yapınız";
else
hata2.innerHTML = "";
var c;

if (Number(a) != "" && Number(b) != "") {
c = Number(a) + Number(b);
if (!isNaN(c))
txtC.value = c;
else
txtC.value = "";
}
else
txtC.value = "";
}
</script>
</head>
<body>
A Sayısını Giriniz : <input id="txtA" type="text" /><span id="hata1"></span><br />
B Sayısını Giriniz : <input id="txtB" type="text" /><span id="hata2"></span><br />
<input id="btnTopla" type="button"
value="Topla" onclick="topla()" /><br />
Toplama İşlemi : <input id="txtC" type="text" />
</body>
</html>
Sadece sayıların girişine izin verme
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script language="javascript" type="text/javascript">
function topla()
{
var a = document.getElementById("txtA").value;
if (a == "")
hata1.innerHTML = "a sayısını giriniz";
else
hata1.innerHTML = "";
var b = document.getElementById("txtB").value;
if (b == "")
hata2.innerHTML = "b sayısını giriniz";
else
hata2.innerHTML = "";
var c;

if (Number(a) != "" && Number(b) != "") {
c = Number(a) + Number(b);
txtC.value = c;
}
else
txtC.value = "";
}

function SayisalKontrol(eventObj) {
var keycode;

if (eventObj.keyCode)
keycode = eventObj.keyCode;
else if (eventObj.Which)
keycode = eventObj.Which;
else
keycode = eventObj.charCode;

if (keycode != 8)
{
if (keycode < 48 || keycode > 57)
return false;
else
return true;
}
}

</script>
</head>
<body>
A Sayısını Giriniz : <input id="txtA" type="text" onkeypress="return SayisalKontrol(event);" /><span id="hata1"></span><br />
B Sayısını Giriniz : <input id="txtB" type="text" /><span id="hata2"></span><br />
<input id="btnTopla" type="button"
value="Topla" onclick="topla()" /><br />
Toplama İşlemi : <input id="txtC" type="text" />
</body>
</html>
 
Cevap yazmak için giriş yap yada kayıt ol.
BBNET
Geri
Üst