Jquery

2024 TYT Matematik İkinci Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama

2024 TYT matematik sorularının çözümünü programlama mantığıyla çözmeye başlayalım. Böylece hem matematik hem de programlama bilgimiz artacaktır. Sorunun çözümünü bilgisayara anlatmak için çözüme ait tüm aşamaları bilmemiz gerekir. Lafı uzatmadan  soruyu verelim.

Sorunun çözümünü adım adım yapalım:

Verilen Yüzdeleri Topla:

Eğitim (43.4%)

Alışveriş (15.6%)

Ulaşım (8.2%)

Eğlence (12.8%)

Verilen Yüzdelerin Toplamını Bul:

43.4 + 15.6 + 8.2 + 12.8 = 80

Diğer Kategoriye Ait Yüzdeyi Hesapla:

100 − 80 = 20

Sonuç:

Diğer kategorisinin yüzdesi 20'tür. Bu durumda doğru cevap 20 (E) olur.

Şimdi kodlama işlemine geçelim.

<!DOCTYPE html>
<html lang="tr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Harcama Hesaplama</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/
bootstrap/4.5.2/css/bootstrap.min.css">
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
</head>
<body>
    <div class="container mt-5">
        <h2>Mayıs Ayı Harcamaları</h2>
        <div class="form-group">
            <label for="egitim">Eğitim (%):</label>
            <input type="number" class="form-control" id="egitim" 
value="43.4" readonly>
        </div>
        <div class="form-group">
            <label for="alisveris">Alışveriş (%):</label>
            <input type="number" class="form-control" id="alisveris" 
value="15.6" readonly>
        </div>
        <div class="form-group">
            <label for="ulasim">Ulaşım (%):</label>
            <input type="number" class="form-control" id="ulasim" 
value="8.2" readonly>
        </div>
        <div class="form-group">
            <label for="eglence">Eğlence (%):</label>
            <input type="number" class="form-control" id="eglence" 
value="12.8" readonly>
        </div>
        <button class="btn btn-primary" id="hesaplaBtn">
Hesapla</button>
        <h3 class="mt-3">Diğer Kategori (%): <span id="sonuc">
</span></h3>
        <div class="alert mt-3" id="cevapMesaji" role="alert" 
style="display: none;"></div>
    </div>

    <script>
        $(document).ready(function () {
            $('#hesaplaBtn').click(function () {
                let egitim = parseFloat($('#egitim').val());
                let alisveris = parseFloat($('#alisveris').val());
                let ulasim = parseFloat($('#ulasim').val());
                let eglence = parseFloat($('#eglence').val());

                let toplam = egitim + alisveris + ulasim + eglence;
                let kalan = 100 - toplam;

                $('#sonuc').text(kalan.toFixed(1));

                // Doğru cevabı kontrol et ve mesaj göster
                let dogruCevap = 20;
                if (kalan.toFixed(1) == dogruCevap) {
                    $('#cevapMesaji').removeClass('alert-danger').
addClass('alert-success').text('Doğru cevap! Kalan kategori yüzdesi: ' 
+ dogruCevap).show();
                } else {
                    $('#cevapMesaji').removeClass('alert-success').
addClass('alert-danger').text('Yanlış cevap. Kalan kategori yüzdesi: ' 
+ kalan.toFixed(1)).show();
                }
            });
        });
    </script>
</body>
</html>
İlgili Makaleler
JQuery Script Dilinde mouseover ve mouseenter Olayları
2024 TYT Matematik Dördüncü Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
2022 TYT Matematik Onbirinci Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
2023 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
Facebook Web Sayfasına Ait Üye Kayıt Formunu Tasarlayan Programı JQuery İle Kodlayınız
Paralelkenarın Alanını Bulan Programı JQuery Script Dilinde Yapınız
Yamuğun Alanını Bulan Programı JQuery Script Dilinde Yapınız
JQuery Script Dilinde change Olayı
Verilen Resmi Ekranın Ortasında Büyüyerek Görüntüleyen Programı JQuery İle Yapınız
Verilen Bir Resmin Ekranın Sağ Üst Köşesinden Başlayarak Büyüyerek Küçülmesini Sağlayan Programı JQuery İle Yapınız
Verilen Bir Resmin Ekranın Sol Alt Köşesinden Başlayarak Büyüyerek Küçülmesini Sağlayan Programı JQuery İle Yapınız
Daktilo Efekti Kullanarak Son Dakika Haberlerini Görüntüleyen Programı JQuery İle Yapınız
Ekranın Ortasında Tanımlı Bir Sahnede Yön Tuşlarıyla Hareket Eden Nesne Animasyonunu JQuery İle Yapınız
Web Sayfasını Excel Programına Aktaran Programı JQuery İle Yapınız
Web Sayfasını Word Programına Aktaran Programı JQuery İle Yapınız
JQuery Yardımıyla Web Sayfasından JSON Veri Çekme
2022 TYT Matematik İkinci Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
Web Sayfasında Bir Elementin Gizli Olup Olmadığını jQuery Diliyle Kontrol Etme
Tetris Oyununu Javascript Dilini Kullanarak Web Sayfasında Kodlama6

Yorum Ekle
   
Kötü İyi