Membuat Kalkulator Hipotek dengan JavaScript

Membuat Kalkulator Hipotek dengan JavaScript

—

by

Webbiz.ID
in ,

Berikut ini adalah contoh kode untuk membuat kalkulator hipotek lengkap dengan JavaScript, CSS, dan HTML. Kode ini akan menghitung jumlah pembayaran bulanan berdasarkan jumlah pinjaman, suku bunga, dan jangka waktu pinjaman yang dimasukkan oleh pengguna.

Kalkulator Hipotek

Kalkulator Hipotek

HTML
<!DOCTYPE html>
<html>
<head>
  <title>Kalkulator Hipotek</title>
  <style>
    /* CSS untuk tampilan kalkulator */
    .container {
      width: 500px;
	background: white;
	margin: 30px auto;
	padding: 30px 20px;
    }

    .form-group {
      margin-bottom: 10px;
    }

    .form-group label {
      display: block;
      font-weight: bold;
    }

    .form-group input {
          box-sizing : border-box;
	width: 100%;
	padding: 10px;
	font-size: 11pt;
	margin-bottom: 20px;
    }

    .form-group button {
      width: 100%;
      padding: 10px;
      background-color: #4CAF50;
      color: white;
      border: none;
      border-radius: 3px;
      cursor: pointer;
    }

    .result {
      margin-top: 20px;
      font-weight: bold;
    }
  </style>
</head>
<body>
  <div class="container">
    <h2>Kalkulator Hipotek</h2>
    <div class="form-group">
      <label for="loanAmount">Jumlah Pinjaman:</label>
      <input type="number" id="loanAmount" placeholder="Masukkan jumlah pinjaman">
    </div>
    <div class="form-group">
      <label for="interestRate">Suku Bunga (% per tahun):</label>
      <input type="number" id="interestRate" placeholder="Masukkan suku bunga">
    </div>
    <div class="form-group">
      <label for="loanTerm">Jangka Waktu Pinjaman (tahun):</label>
      <input type="number" id="loanTerm" placeholder="Masukkan jangka waktu pinjaman">
    </div>
    <div class="form-group">
      <button onclick="calculate()">Hitung</button>
    </div>
    <div class="result">
      <p id="monthlyPayment"></p>
    </div>
  </div>

  <script>
    function calculate() {
      var loanAmount = document.getElementById('loanAmount').value;
      var interestRate = document.getElementById('interestRate').value;
      var loanTerm = document.getElementById('loanTerm').value;

      var monthlyInterestRate = interestRate / 100 / 12;
      var numberOfPayments = loanTerm * 12;

      var monthlyPayment = (loanAmount * monthlyInterestRate) / (1 - Math.pow(1 + monthlyInterestRate, -numberOfPayments));

      document.getElementById('monthlyPayment').innerHTML = 'Pembayaran Bulanan: ' + monthlyPayment.toFixed(2);
    }
  </script>
</body>
</html>
HTML

Anda dapat menyalin kode di atas dan menyimpannya dalam file HTML untuk melihat kalkulator hipotek dalam tindakan. Pastikan untuk menyimpan file dengan ekstensi .html dan membukanya menggunakan browser web.

Kode di atas menggunakan JavaScript untuk mengambil input dari pengguna dan menghitung pembayaran bulanan berdasarkan rumus kalkulator hipotek. CSS digunakan untuk mengatur tampilan kalkulator agar terlihat lebih menarik dan terstruktur. HTML digunakan untuk membuat form input dan menampilkan hasil perhitungan.

Silakan mencoba kode di atas dan mengubahnya sesuai kebutuhan Anda. Semoga bermanfaat!

Artikel Terbaru ⭐