Jquery Dikdörtgen Alan ve Çevre Hesaplama

HTML Form nesneleri kullanarak basit alan ve çevre hesabı yapılıp, sonuç HTML nesnesi içinde gösterilmiştir.

Kod:


<!doctype html>
<html>
    <head>
        <title>Jquery Örnekleri</title>
        <meta charset="utf-8">
        <style>
            label{
                display: block;
            }
        </style>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
    </head>
    <body>
        <h1>Dikdörtgen Alan ve Çevre Hesaplama</h1>
        <h2 id="alan"></h2>
        <h2 id="cevre"></h2>
        <label for="uzunluk">Uzunluk:
            <input type="text" id="uzunluk">
        </label>
        <label for="genislik">Genişlik:
            <input type="text" id="genislik">
        </label>
        <button id="hesapla">Hesapla</button>
        
        <script>
            
            
            $("#hesapla").bind('click',function(){
                
                var uzunluk=Number($("#uzunluk").val());
                var genislik=Number($("#genislik").val());
                
                
                $("#alan").html("Dikdörtgen Alanı:"+genislik*uzunluk);
                $("#cevre").html("Dikdörtgen Çevresi:"+2*(genislik+uzunluk));
            });
  
        </script>
    </body>
</html>

<!doctype html>

<html>

<head>

<title>Jquery Örnekleri</title>

<style>

label{

display: block;

}

</style>

</head>

<body>

<h1>Dikdörtgen Alan ve Çevre Hesaplama</h1>

<label for="uzunluk">Uzunluk:

</label>

<label for="genislik">Genişlik:

</label>

<button id="hesapla">Hesapla</button>

$("#hesapla").bind('click',function(){

var uzunluk=Number($("#uzunluk").val());

var genislik=Number($("#genislik").val());

$("#alan").html("Dikdörtgen Alanı:"+genislik*uzunluk);

$("#cevre").html("Dikdörtgen Çevresi:"+2*(genislik+uzunluk));

});

</script>

</body>

</html>

Çıktı:

EtiketlerJquery Örnekleri

Jquery Dikdörtgen Alan ve Çevre Hesaplama

Yorum Yap

İptal Et

Bunları da beğenebilirsiniz

Yorum Yap