ワードプレスサイトにローンシュミレーションを設置する

この記事では、ワードプレスサイトにローンシュミレーションを設置する方法を解説いたします。コピペで簡単に設置できるのでご利用ください。

元利均等でのローンシュミレーション

元利均等でのローンシュミレーションで、毎月の返済額が試算できます。

javascriptで記述されたコードをコピペで簡単に設置できますが、計算式を覚えておくと利用方法やカスタマイズの幅が広がるかと思いますので、記載します。

【計算式】

毎月の返済額＝（借入金額×（借入金利÷12）×（1+（借入金利÷１２））＾返済回数）÷（（1+（借入金利÷１２））＾返済回数ー１）

計算式に数字を入れていくと下記になります。

エクセルに＝以降を入力すると確認できます。

借入金額：3,000万円

借入金利：0.75％

返済回数：420回

81235.45＝(30000000*(0.0075/12)*(1+(0.0075/12))^420)/((1+(0.0075/12))^420-1)

Javascriptで元利均等ローンシュミレーションを作成する

下記の様なローンシュミレーションを設置できます。

デザインなどはカスタマイズしてお使いいただけます。

ここから下にコードを記載しております。

【フォーム】

設置箇所：記事内

inputの各要素に下記のnameを割り当てて、ユーザーが入力後に計算ボタンをクリックすると、javascriptで作成されたPMT（）関数が実行されてoutputの要素の値が変わります。

借入金額：pv

融資金利：ir

返済期間（月数）:np

<form method="post" target="_top" name="loan">

<table>

<tr>

<td>借入金額：<input name="pv" id="pv" value="4000" size="10" min="1">万円</td>

</tr>

<tr>

<td>融資金利：<input type="number" name="ir" id="ir" value="0.625" size="10" min="0.3">%</td></tr><tr><td>返済期間（月数）：<input type="number" name="np" id="np" value="420" size="10" min="1" max="420">ヶ月</td>

</tr>

</table>

<div style="text-align:center; margin-top:20px;"><button type="button" class="square_btn" onclick="a.value = PMT ();">計算</button></div>

<table>

<tr>

<th>返済月額</th>

</tr>

<tr>

<td><input name="a" class="satei_result" value="（計算結果）"><span class="red">円</span></td>

</tr>

</table>

</form>

【Javascript】

設置箇所：一つの記事で使用するのであれば記事内に、複数の記事で使用するのであればfooter.phpにペーストして下さい。

下記の変数を宣言し、formのinput要素を代入します。

借入金額：pv　＝　document.loan.pv.value

融資金利：ir　＝　document.loan.ir.value

返済期間（月数）:np　＝　document.loan.np.value

「parseFloat関数」は文字列を数値に変換する関数です。

「floor関数」は小数点以下の値を切り捨てた結果を返します。

「pow関数」は1番目の引数を、2番目の引数で累乗した値を返します。

「toLocaleString関数」で整数部分を3桁毎に区切り文字を挿入した形式で文字列に変換した結果を返します。（ロケールに応じたNumberクラスのオブジェクトの文字列表現を返します。）

<script>

function PMT() {

var pv = parseFloat(document.loan.pv.value);

var ir = parseFloat(document.loan.ir.value);

var np = parseFloat(document.loan.np.value);

   return Math.floor((pv *10000 * (ir / 100 / 12) * (Math.pow(1 + (ir / 100 / 12), np))) / (Math.pow(1 + (ir / 100 / 12), np) -1)).toLocaleString();

}

</script>