js

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    Total<input type="text" id="total" name="total" value="10000" onkeyup="sum();" >
    Bayar<input type="number" id="bayar" name="bayar" onkeyup="sum();">
    Kembali<input type="text" id="rupiah" readonly>


<script type="text/javascript">
    function sum() {
        var total = document.getElementById('total').value;
        var bayar = document.getElementById('bayar').value;
        var result = parseInt(bayar) - parseInt(total);
        if (!isNaN(result)) {
          document.getElementById('rupiah').value = formatRupiah(new String(result), 1);
        }
    }
    // var rupiah = document.getElementById('rupiah');
    // rupiah.addEventListener('keyup', function(e){
    //  // tambahkan 'Rp.' pada saat form di ketik
    //  // gunakan fungsi formatRupiah() untuk mengubah angka yang di ketik menjadi format angka
    //  rupiah.value = formatRupiah(this.value, 'Rp. ');
    // });

    /* Fungsi formatRupiah */
    function formatRupiah(angka, prefix){
        var number_string = angka.replace(/[^,\d]/g, '').toString(),
        split           = number_string.split(','),
        sisa            = split[0].length % 3,
        rupiah          = split[0].substr(0, sisa),
        ribuan          = split[0].substr(sisa).match(/\d{3}/gi);

        // tambahkan titik jika yang di input sudah menjadi angka ribuan
        if(ribuan){
            separator = sisa ? '.' : '';
            rupiah += separator + ribuan.join('.');
        }

        rupiah = split[1] != undefined ? rupiah + ',' + split[1] : rupiah;
        return prefix == undefined ? rupiah : (rupiah ? 'Rp. ' + rupiah : '');
    }
</script>
</body>
</html>