常用的前端还款计算器（包括按月等额本息、按四月等额本息、到期还本付息、到期还本按月付息四种还款方式）

最新推荐文章于 2023-04-19 17:29:38 发布

nuc_八道门

最新推荐文章于 2023-04-19 17:29:38 发布

阅读量7.1k

点赞数 1

分类专栏：软件开发前端开发

本文链接：https://blog.csdn.net/nuc_badaomen/article/details/85242469

版权

软件开发同时被 2 个专栏收录

73 篇文章 0 订阅

订阅专栏

前端开发

28 篇文章 0 订阅

订阅专栏

四种还款方式的计算公式自行百度即可

按月等额本息还款法见：

https://baike.baidu.com/item/%E7%AD%89%E9%A2%9D%E6%9C%AC%E6%81%AF/3227456

到期还本付息法见：

https://baike.baidu.com/item/%E4%B8%80%E6%AC%A1%E8%BF%98%E6%9C%AC%E4%BB%98%E6%81%AF%E6%B3%95/10640616?fr=aladdin

到期还本按月付息法如下：

每次（不包含最后一次）还款金额为：出借总额×月利率
最后一次还款金额为：出借总额×月利率 + 借款总额

按四月等额本息法：

同按月等额本息是一样的，详情请看代码即可

直接上源码：

<!DOCTYPE html>
<html lang="zh-cn">
<head>
	<meta charset="UTF-8">
	<title>还款计算器</title>
</head>
<style>
	td{
		text-align:center;
	}
</style>
<body>
	<p>金额：</p>	
	<p><input type="text" value='' name="account" id='account'></p>
	<p>年利率：</p>
	<p><input type="text" value='' name="apr" id='apr'></p>
	<p>期限：</p>
	<p>
		<select name="time_limit" id="time_limit">
			<option value="1">1个月</option>
			<option value="2">2个月</option>
			<option value="3">3个月</option>
			<option value="4">4个月</option>
			<option value="5">5个月</option>
			<option value="6">6个月</option>
			<option value="7">7个月</option>
			<option value="8">8个月</option>
			<option value="9">9个月</option>
			<option value="10">10个月</option>
			<option value="11">11个月</option>
			<option value="12">12个月</option>
		</select>
	</p>
	<p>还款方式：</p>
	<p>
		<select name="type" id="type">
			<option value="1">按月等额本息</option>
			<option value="3">到期还本按月付息</option>
			<option value="4">到期还本付息</option>
		</select>
	</p>
	<p><button type='button' id="cal">计算</button></p>
	<table border='1px' cellspacing="0" width='700px' id='table'>
	</table>

</body>
<script>
	var account    = document.getElementById('account');
	var apr        = document.getElementById('apr');
	var time_limit = document.getElementById('time_limit');
	var typeObj    = document.getElementById('type');
	var cal  	   = document.getElementById('cal');
	var table  	   = document.getElementById('table');
	var money      = account.value;   //借款金额
	var year_apr   = (apr.value)/100; //年利率
	var period     = time_limit.value;//借款期限
	var type       = typeObj.value;      //还款方式
	var month_apr  = year_apr/12;     //月利率

	time_limit.onchange = function(){
		period = time_limit.value;
		if(period==8){
			typeObj.options.add(new Option('按4月等额本息',2)); 
		}else{
			typeObj.options.remove(3);
		}
	} 

	cal.onclick=function(){
		money      = account.value;   //借款金额
		year_apr   = (apr.value)/100; //年利率
		period     = time_limit.value;//借款期限
		type       = typeObj.value;      //还款方式
		month_apr  = year_apr/12;     //月利率
		str=_cal(money,period,type,month_apr);
		if(str!=false){
 			table.innerHTML=str;
		}
	}
	/**
	* @param money     借款金额
	* @param period    借款期限
	* @param type      还款方式  1 按月等额本息  2 按4月等额本息 3 到期还本按月付息 4 到期还本付息
	* @param month_apr 月利率
	* @return string
	*/
	function _cal(money,period,type,month_apr){
		var interest_tot   = 0;       //预期收益
		var repayment_tot   = 0;       //本息合计
		if(false == isNumber(money)){
			alert('借款金额格式错误');
			return false;
		}
		if(false == isNumber(month_apr)){
			alert('年利率格式错误');
			return false;
		}
		if(0 == money || money < 0){
			alert('借款金额不能小于或者等于0');
			return false;
		}
		if(0 == month_apr || month_apr < 0){
			alert('年利率不能小于或者等于0');
			return false;
		}
		var str = '<tr>\
					<th>期数</th>\
					<th>回款本息</th>\
					<th>回款本金</th>\
					<th>利息</th>\
    			</tr>';
		//每月还款额 
		if(type == 1){
	 		repayment  = (money * month_apr * Math.pow((1 + month_apr),period))/(Math.pow((1 + month_apr),period) - 1);
	 		for (var i = 1 ; i <=period ; i++) {
	 			capital     = (money * month_apr * Math.pow((1 + month_apr),i - 1))/(Math.pow((1 + month_apr),period) - 1);
	 			repayment_a = repayment.toFixed(2);
	 			capital     = capital.toFixed(2);
	 			interest_a  = (repayment_a - capital).toFixed(2);
	 			
	 			interest_tot+=interest_a*1;  //预期收益
	 			repayment_tot+=repayment_a*1//本息合计
	 			//月收本息

	 			str+='<tr>\
			 			<td>'+i+'</td>\
			 			<td>'+repayment_a+'</td>\
			 			<td>'+capital+'</td>\
			 			<td>'+interest_a+'</td>\
	 				</tr>';
	 		}
	 		str+='<tr><td colspan="4">预期收益：'+interest_tot.toFixed(2)+'   本息合计：'+repayment_tot.toFixed(2)+'  月收本息：'+repayment_a+'</td></tr>';
		}else if(type == 2){
			month_apr_new = month_apr * 4;
			period_new    = period / 4;
 			repayment  = (money * month_apr_new * Math.pow((1 + month_apr_new),period_new))/(Math.pow((1 + month_apr_new),period_new) - 1);
	 		for (var i = 1 ; i <=period_new ; i++) {
	 			capital     = (money * month_apr_new * Math.pow((1 + month_apr_new),i - 1))/(Math.pow((1 + month_apr_new),period_new) - 1);
	 			repayment_a = repayment.toFixed(2);
	 			capital     = capital.toFixed(2);
	 			interest_a  = (repayment_a - capital).toFixed(2);
	 			str+='<tr>\
			 			<td>'+i+'</td>\
			 			<td>'+repayment_a+'</td>\
			 			<td>'+capital+'</td>\
			 			<td>'+interest_a+'</td>\
	 				</tr>';

	 		}
		}else if(type == 3){
			interest_a  = (money * month_apr).toFixed(2);
	 		for (var i = 1 ; i <=period ; i++) {
	 			capital     = 0;
	 			repayment_a = interest_a;
	 			if (i == period){
	 				capital 	= money;
	 				repayment_a = interest_a*1 + capital*1;
	 			}
	 			str+='<tr>\
			 			<td>'+i+'</td>\
			 			<td>'+repayment_a+'</td>\
			 			<td>'+capital+'</td>\
			 			<td>'+interest_a+'</td>\
	 				</tr>';
	 		}

		}else if(type == 4){
			//贷款本金×[1+月利率（‰）×贷款期（月）] 
			repayment = money * (1 + month_apr * period);
			repayment_a = repayment.toFixed(2);
			interest_a = (repayment_a - money).toFixed(2);
			str+='<tr>\
	 			<td>第'+period+'个月</td>\
	 			<td>'+repayment_a+'</td>\
	 			<td>'+money+'</td>\
	 			<td>'+interest_a+'</td>\
				</tr>';
		}else{
			str = '不存在';
		}
		
		return str;
	}

	function isNumber(val){
	    var regPos = /^\d+(\.\d+)?$/; //非负浮点数
	    var regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/; //负浮点数
	    if(regPos.test(val) || regNeg.test(val)){
	        return true;
	    }else{
	        return false;
	    }
	}

</script>
</html>

nuc_八道门

关注

1
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
常用的前端还款计算器（包括按月等额本息、按四月等额本息、到期还本付息、到期还本按月付息四种还款方式）

四种还款方式的计算公式自行百度即可按月等额本息还款法见：https://baike.baidu.com/item/%E7%AD%89%E9%A2%9D%E6%9C%AC%E6%81%AF/3227456到期还本付息法见：https://baike.baidu.com/item/%E4%B8%80%E6%AC%A1%E8%BF%98%E6%9C%AC%E4%BB%98%E6%81...
复制链接

扫一扫