Jquery

Paralelkenarın Alanını Bulan Programı JQuery Script Dilinde Yapınız

Yeni bir Web Tasarım ve Programlama dersi makalesi ile birlikteyiz.

Çarpma işlemi paralel kenarın alanını bulma işleminde kullanılmaktadır. Taban kenarı ile yükseklik değerini çarpımı paralel kenarın alanını vermektedir. Çözüme başlamadan önce, probleme ait analiz işlemlerini, algoritmayı ve istenirse akış şemasını yapmalıyız. Şimdi uygulamayı gerçekleştirmeye çalışalım.

Sabit değerler ile sonucu bulma

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="https://www.w3.org/1999/xhtml">

<head>

    <title></title>

    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(function () {

            var a = 6;

            var b = 7;

            var alan = a * b;

            alert(alan);

        });

    </script>

</head>

<body>

</body>

</html>

Değişen değerler ile sonucu bulma

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="https://www.w3.org/1999/xhtml">

<head>

    <title></title>

    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(function () {

            var a = prompt("a kenarı");

            var b = prompt("b kenarı");

            var alan;

            alan = Number(a) * Number(b);

            alert(alan);

        });

    </script>

</head>

<body>

</body>

</html>

Formatlı çıkış işlemi yaparak sonucu bulma

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="https://www.w3.org/1999/xhtml">

<head>

    <title></title>

    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(function () {

            var a = prompt("a kenarı");

            var b = prompt("b kenarı");

            var alan;

            alan = Number(a) * Number(b);

            $(".sonuc").html("ALAN = a * b = " + a + " * " + b + " = " + alan);

        });

    </script>

</head>

<body>

<p class="sonuc"></p>

</body>

</html>

Formatlı giriş işlemi yaparak sonucu bulma

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="https://www.w3.org/1999/xhtml">

<head>

    <title></title>

    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>

    <script type="text/javascript">

        $.bul = function () {

            var a = $('#txtA').val();

            var b = $('#txtB').val();

            var alan;

            alan = Number(a) * Number(b);

            $('#txtALAN').val(alan);

        };

    </script>

</head>

<body>

    A Sayısı : <input id="txtA" type="text" /><br />

    B Sayısı : <input id="txtB" type="text" /><br />

    <input id="Button1" type="button" value="Alanı Bul" onclick="$.bul();" />

<br />

    Alanı : <input id="txtALAN" type="text" /><br />

</body>

</html>

Girişlerin Boş Olup Olmadığını Kontrol Ederek Sonucu Bulma

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="https://www.w3.org/1999/xhtml">

<head>

    <title></title>

    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>

    <script type="text/javascript">

        $.bul = function () {

            var a = $('#txtA').val();

            if (a == "")

                hata1.innerHTML = "a kenarını giriniz";

            else

                hata1.innerHTML = "";

            var b = $('#txtB').val();

            if (b == "")

                hata2.innerHTML = "b kenarını giriniz";

            else

                hata2.innerHTML = "";

            var alan;

            if (Number(a) != "" && Number(b) != "") {

                alan = Number(a) * Number(b);

                $('#txtALAN').val(alan);

            }

        };

    </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="Button1" type="button" value="Alanı Bul" onclick="$.bul();" />

<br />

    ALAN : <input id="txtALAN" type="text" /><br />

</body>

</html>

Sadece sayısal değerlerin girişine izin vererek sonucu bulma

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="https://www.w3.org/1999/xhtml">

<head>

    <title></title>

    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>

    <script type="text/javascript">

        $.bul = function () {

            var a = $('#txtA').val();

            if (a == "")

                hata1.innerHTML = "a kenarını giriniz";

            else if (isNaN(a))

                hata1.innerHTML = "Lütfen Sayısal Değer Girişi Yapınız";

            else

                hata1.innerHTML = "";

            var b = $('#txtB').val();

            if (b == "")

                hata2.innerHTML = "b kenarını giriniz";

            else if (isNaN(b))

                hata2.innerHTML = "Lütfen Sayısal Değer Girişi Yapınız";

            else

                hata2.innerHTML = "";

            var alan;

            if (Number(a) != "" && Number(b) != "") {

                alan = Number(a) * Number(b);

                if (!isNaN(alan)) {

                    $('#txtALAN').val(alan);

                }

                else

                    $('#txtALAN').val("");

            }

            else

                $('#txtALAN').val("");

        };

    </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="Button1" type="button" value="Bul" onclick="$.bul();" />

<br />

    ALAN: <input id="txtALAN" type="text" /><br />

</body>

</html>

Girişte sadece sayıların girişine izin verme

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="https://www.w3.org/1999/xhtml">

<head>

    <title></title>

    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>

    <script type="text/javascript">

        $.bul = function () {

            var a = $('#txtA').val();

            if (a == "")

                hata1.innerHTML = "a kenarını giriniz";

            else

                hata1.innerHTML = "";

            var b = $('#txtB').val();

            if (b == "")

                hata2.innerHTML = "b kenarını giriniz";

            else

                hata2.innerHTML = "";

            var alan;

            if (Number(a) != "" && Number(b) != "") {

                alan = Number(a) * Number(b);

                $('#txtALAN').val(alan);

            }

            else

                $('#txtALAN').val("");

        };

        var SayisalKontrol = function(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ı : <input id="txtA" type="text"

onkeypress="return SayisalKontrol(event);" /><span id="hata1"></span><br />

B Sayısı : <input id="txtB" type="text"

onkeypress="return SayisalKontrol(event);" />

<span id="hata2"></span><br />

    <input id="Button1" type="button" value="Bul" onclick="$.bul();" />

<br />

    ALAN : <input id="txtALAN" type="text" /><br />

</body>

</html>

 
İlgili Makaleler
2022 TYT Matematik Yirmiüçüncü Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
JQuery Yardımıyla Web Sayfasından JSON Veri Çekme
2022 TYT Matematik Üçüncü Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
Alt Ortadan Başlayıp Farklı Köşelerde Biten 5 Resme Ait Animasyonu Jquery Diliyle Kodlayınız
2022 TYT Matematik Onbirinci Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
Facebook Web Sayfasına Ait Üye Kayıt Formunu Tasarlayan Programı JQuery İle Kodlayınız
2022 TYT Matematik Birinci Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
Core Mvc Projesinde Resmin Sağ Alttan Başlayıp Sol Altta Biten Animasyonu Jquery Dilinde Kodlayınız
2023 TYT Matematik Beşinci Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
2022 TYT Matematik Onaltıncı Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
2022 TYT Matematik Onsekizinci Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
2022 TYT Matematik İkinci Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
Personele Ait Boy ve Kilo Bilgilerine Göre İdeal Kiloyu Bulan Uygulamayı jQuery İle Yapınız
2024 TYT Matematik Üçüncü Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
2022 TYT Matematik Yirmidördüncü Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
JQuery Script Dilinde preventDefault, stopPropagation ve return false Olayı
2024 TYT Matematik Birinci Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
2024 TYT Matematik İkinci Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
Koordinat Düzleminde Verilen İki Nokta Arasındaki Uzunluğu Bulan Jquery Uygulamasını Yapınız
Ekranın Ortasında Başlayıp Farklı Köşelerde Bütün Olarak Kaybolan 5 Resme Ait Animasyonu Jquery Diliyle Kodlayınız

Yorum Ekle
   
Kötü İyi