Bikin Alat Hitung Sederhana ala Excel di Blog

Selasa, 29 April 2025 edit

Hai bro/sis, aku baru belajar JavaScript dan pengen bikin kalkulasi simpel kayak di Excel: A1 * A2 = A3, bisa ubah angka, dan ada tombol reset buat kosongin. Ternyata gampang banget! Ini catatanku, cocok buat yang suka Excel kayak aku. 😄

Apa yang Kita Bikin?

  • Dua kotak input (A1 dan A2) buat masukin angka.
  • Hasil A3 otomatis update (A1 * A2) tiap kita ketik.
  • Tombol reset buat hapus semua (A1 = kosong, A2 = kosong, A3 = 0).

Kode Simpelnya


<!--Kode ultra-ringkas-->
<input id="a1" oninput="a3.textContent=(parseFloat(a1.value)||0)*(parseFloat(a2.value)||0)" style="width: 80px;" type="number" value="8" /> x 
<input id="a2" oninput="a3.textContent=(parseFloat(a1.value)||0)*(parseFloat(a2.value)||0)" style="width: 80px;" type="number" value="2" /> = 
<b id="a3">16</b>
<button id="r" onclick="a1.value=a2.value='';a3.textContent='0'">Reset</button>

<script>
    // Reset: kosongin A1, A2, set A3=0
    r.onclick = () => { a1.value = a2.value = ''; a3.textContent = '0'; };
</script>

Copy-paste kode ini ke posting Blogger (pasti di HTML view, bukan Compose ya!). Hasilnya seperti berikut.


`x` = 16

Cara Kerjanya (Excel Vibes!)

Bayangin ini kayak Excel:

  • Kotak A1 dan A2: Cell tempat masukin angka (awalnya 8 dan 2).
  • A3: Cell hasil, kayak ketik =A1*A2, langsung update tiap A1/A2 berubah.
  • Reset: Kayak tekan Delete, bikin A1 dan A2 kosong, A3 jadi 0.

Langkah-Langkah Pasang di Blogger

  1. Buka Blogger, buat posting baru.
  2. Pindah ke HTML view (bukan Compose).
  3. Salin semua kode di atas.
  4. Paste, terus publish.
  5. Buka posting, coba ubah angka A1 atau A2, A3 bakal berubah otomatis. Klik Reset, semua kosong!

Tips Kalau Gak Jalan

  • Error?
    Buka browser, tekan F12, cek tab Console. Kalau ada error, pastiin kode dipaste bener.
  • Tanya:
    Masih bingung? Komen di blog ini, kita ngulik bareng!

Mau Ubah Formula?

Pengen A3 = A1 + A2? Ganti bagian * jadi + di oninput di kode, misal:

oninput="a3.textContent=(parseFloat(a1.value)||0)+(parseFloat(a2.value)||0)"

Simpel kan, kayak ganti formula di Excel!

Itu dulu catatanku, Bro/Sis. Aku juga pemula, jadi kita belajar bareng ya. 😎 Kalau suka, share atau komen di bawah. Happy coding!

Bagikan di

Tidak ada komentar:

Posting Komentar

 
Copyright © 2015-2025 Urip dot Info | Disain Template oleh Herdiansyah Dimodivikasi Urip.Info