https://www.nishikofu.co.jp/wp_nkofu/wp-content/themes/nkofu_tm/js/loan_calculator.js

1/*====================================
2	■　数値スライダー single-post_bukken.phpに直書きした
3====================================*/
4/*
5$(function() {
6	  var $document   = $(document),
7		selector    = '[data-rangeslider]',
8		$element    = $(selector);
9		
10	  function valueOutput(element) {
11		var value = element.value,
12		  output = element.parentNode.getElementsByClassName('atai')[0] || element.parentNode.parentNode.getElementsByClassName('atai')[0];
13		  //output.innerHTML = value;
14		  output.value = value;
15	  }
16	  
17	  for (var i = $element.length - 1; i >= 0; i--) {
18		valueOutput($element[i]);
19	  };
20	  
21	$document.on('change', 'input[type="range"]', function(e) {
22		valueOutput(e.target);
23		$('#loan').calculation();
24	});
25	  
26	$('#amount').on('change', function(e) {
27		$('#amount_sl').val(this.value).change();
28		$('#loan').calculation();
29	});
30
31	$('#bonus').on('change', function(e) {
32		$('#bonus_sl').val(this.value).change();
33		$('#loan').calculation();
34	});
35
36	$('#periods').on('change', function(e) {
37		$('#periods_sl').val(this.value).change();
38		$('#loan').calculation();
39	});
40
41	$('#rate').on('change', function(e) {
42		$('#rate_sl').val(this.value).change();
43		$('#loan').calculation();
44	});
45	  
46	  
47	  $element.rangeslider({
48		polyfill: false,
49		onInit: function() {
50			
51			$('#amount_sl').val(0).change();
52			$('#bonus_sl').val(0).change();
53			$('#periods_sl').val(1).change();
54			$('#rate_sl').val(0.1).change();
55			
56		},
57		onSlide: function(position, value) {
58		  //console.log('onSlide');
59		  //console.log('position: ' + position, 'value: ' + value);
60		},
61		onSlideEnd: function(position, value) {
62		 // console.log('onSlideEnd');
63		  //console.log('position: ' + position, 'value: ' + value);
64		}
65	  });
66		
67
68});
69*/
70
71
72
73
74/*====================================
75	■　ローン計算
76====================================*/
77
78$(document).ready(function() {
79
80
81	$('#answer').removeClass('on').addClass('off');	
82	$('#btn_keisan').click(function(){
83		$('#loan').simuJikko();
84	});
85	
86	$.fn.simuJikko = function(){
87		var amount	= $('#amount').val()
88		var bonus	= $('#bonus').val();
89		var rate	= $('#rate').val();
90		var periods	= $('#periods').val();
91		//alert('物件価格 '+ amount + ',' +  'ボーナス '+ bonus + ',' +  '金利 '+ rate + ',' +  '期間 '+ periods);
92		
93		$('div.msg').remove();
94		$('input.missed').removeClass('missed');
95		$('#err_answer').remove();
96		$('#answer input').val('');
97		$('#answer').removeClass('on');
98		$('#loan').loansumilation();
99		if($('#answer').hasClass('on')){
100			$('#loan').calculation();
101		}
102		
103		if($('#keisan .data').has('div.msg')){
104			$('#keisan .data').has('div.msg').find('input').addClass('missed');
105		}
106	}
107		
108	
109});
110
111
112(function($){
113	$.fn.calculation = function(){
114	
115		var amount = 0;
116		var rate   = 0;
117		var periods  = 0;
118		var bonus  = 0;
119	
120		var amount = parseFloat(($('#amount').val())*10000);
121		//amount = amount - parseFloat(($('#atama').val())*10000);
122
123		//alert(amount);
124		
125		var rate   = parseFloat($('#rate').val());
126		var periods  = parseFloat($('#periods').val()) * 12;
127		var bonus  = parseFloat(($('#bonus').val())*10000);
128		
129		
130		//毎月の返済額
131		var rate_m = rate / 100 / 12;
132		var repaid_m = parseInt( (amount - bonus) * rate_m * Math.pow((1 + rate_m),periods) / (Math.pow((1 + rate_m),periods) - 1) );
133		//alert(isNaN(repaid_m));
134		
135		
136		//元金
137		var gankin =  Math.round((amount - bonus) / periods);
138		
139		//利息
140		var risoku = repaid_m - gankin;
141
142		
143		//ボーナス分の返済額 加算額
144		var rate_m = rate / 100 / 2;
145		var repaid_b = parseInt(bonus * rate_m * Math.pow((1 + rate_m), periods / 6) / (Math.pow((1 + rate_m), periods / 6) - 1) );
146		
147		//ボーナス分の返済額合計
148		var repaid_b_gokei = repaid_b + repaid_m;
149		if(repaid_b == 0) repaid_b_gokei = 0;
150	
151	
152		//1年間の返済額
153		var repaid_y = repaid_m * 12 + repaid_b * 2;
154		
155		
156		//総返済額返済額
157		var sogaku = (repaid_m * periods) + (repaid_b *periods / 6);
158	
159				
160		
161		if(isNaN(repaid_m) == true || isNaN(repaid_b) == true || isNaN(repaid_y) == true){
162			$('#loan #result_m').val(0);
163			$('#loan #result_bonus').val(0);
164			$('#loan #result_y').val(0);
165			$('#answer .kekka').addClass('missed');
166			var err_answer = '<div id="err_answer"><p class="msg">※現在の数値では試算できません。</p>/div>'
167			$('#answer .kekka').append(err_answer);
168		}else{
169			//数値をカンマ区切りにする
170			var repaid_m = repaid_m.toString().replace( /([0-9]+?)(?=(?:[0-9]{3})+$)/g , '$1,' );
171			var repaid_b = repaid_b.toString().replace( /([0-9]+?)(?=(?:[0-9]{3})+$)/g , '$1,' );
172			var repaid_y = repaid_y.toString().replace( /([0-9]+?)(?=(?:[0-9]{3})+$)/g , '$1,' );
173			var gankin = gankin.toString().replace( /([0-9]+?)(?=(?:[0-9]{3})+$)/g , '$1,' );
174			var risoku = risoku.toString().replace( /([0-9]+?)(?=(?:[0-9]{3})+$)/g , '$1,' );
175			var sogaku = sogaku.toString().replace( /([0-9]+?)(?=(?:[0-9]{3})+$)/g , '$1,' );
176			var repaid_b_gokei = repaid_b_gokei.toString().replace( /([0-9]+?)(?=(?:[0-9]{3})+$)/g , '$1,' );
177			
178			
179			$('#loan #result_m').text(repaid_m);
180			$('#loan #btsuki').text(repaid_b);
181			$('#loan #result_y').text(repaid_y);			
182			$('#loan #gankin').text(gankin);
183			$('#loan #risoku').text(risoku);
184			$('#loan #sogaku').text(sogaku);
185			$('#loan #repaid_b_gokei').text(repaid_b_gokei);
186			
187		}		
188		
189		return this;
190	}
191	
192	
193	$.fn.loansumilation = function(){
194		var n =0;
195		var msg_amount = "";
196		var msg_bonus = "";
197		var msg_rate = "";
198		var msg_periods = "";
199		
200		var amount = 0;
201		var bonus = 0;
202		var rate = 0;
203		var periods = 0;
204		
205		var amount = $('#amount').val();
206		var n_amount = 0;

207		if(isNaN(amount) == true){ //数値の場合
208			msg_amount =  '※半角数字で入力してください。';
209			n_amount++;
210		}
211		if(amount <= 0 || !amount.match(/\S/g)){ 
212			msg_amount = msg_amount + '※正しい数字を入力してください。';
213			n_amount++;
214		}
215		if(n_amount !=0){
216			$('.data').has('#amount').append('<div class="msg">' + msg_amount + '</div>');
217		}else{
218			n++;
219		}
220		
221		var bonus = $('#bonus').val();
222		var n_bonus = 0;
223		if(isNaN(bonus) == true){ //数値の場合
224			msg_bonus =  '※半角数字で入力してください。';
225			n_bonus++;
226		}
227		if(bonus < 0 || !bonus.match(/\S/g)){ 
228			msg_bonus = msg_bonus + '※正しい数字を入力してください。';
229			n_bonus++;
230		}
231		/*if(amount < bonus){
232			alert(bonus);
233			alert(amount);
234			alert(bonus - amount);
235			msg_bonus = '※ボーナス払いは借入額以下で入力してください。';
236			n_bonus++;
237		}*/
238/*		alert((amount < bonus));
239		if(amount < bonus){
240			alert(bonus);
241			alert(amount);
242			alert(bonus - amount);
243			msg_bonus = '※ボーナス払いは借入額以下で入力してください。';
244			n_bonus++;
245		}*/
246		if(((bonus*2) - amount) > 0){
247			//alert(bonus - amount);
248			msg_bonus = '※ボーナス払いは借入額の1/2以下で入力してください。';
249			n_bonus++;
250		}
251		if(n_bonus !=0){
252			$('.data').has('#bonus').append('<div class="msg">' + msg_bonus + '</div>');
253		}else{
254			n++;	
255		}
256		
257		var rate = $('#rate').val();
258		var n_rate =0;
259		if(isNaN(rate) == true){ //数値の場合
260			msg_rate =  '※半角数字で入力してください。';
261			n_rate++;
262		}
263		if(rate < 0 || !rate.match(/\S/g)){ 
264			msg_rate = msg_rate + '※正しい数字を入力してください。';
265			n_rate++;
266		}else if(rate == 0){
267			msg_rate = msg_rate + '※利率を入力してください。';
268			n_rate++;	
269		}
270		if(n_rate !=0){
271			$('.data').has('#rate').append('<div class="msg">' + msg_rate + '</div>');
272		}else{
273			n++;	
274		}
275		
276		var periods = $('#periods').val();
277		var n_periods = 0;
278		if(isNaN(periods) == true){ //数値の場合
279			msg_periods =  '※半角数字で入力してください。';
280			n_periods++;
281		}
282		if(periods < 0 || !periods.match(/\S/g)){ 
283			msg_periods = msg_periods + '※正しい数字を入力してください。';
284			n_periods++;
285		}else if(periods == 0){
286			msg_periods = msg_periods + '※期間を入力してください。';
287			n_periods++;	
288		}
289		if(n_periods !=0){
290			$('.data').has('#periods').append('<div class="msg">' + msg_periods + '</div>');
291		}else{
292			n++;	
293		}
294		
295		if(n!=4){
296			//alert('失敗： '+ '借入額 '+ amount + ',' +  'ボーナス '+ bonus + ',' +  '利率 '+ rate + ',' +  '期間 '+ periods);
297			return false;
298		}else{
299			//alert('成功： '+ '借入額 '+ amount + ',' +  'ボーナス '+ bonus + ',' +  '利率 '+ rate + ',' +  '期間 '+ periods);
300			$('#answer').removeClass('off').addClass('on');
301			return true;
302		}
303		return this;
304	}
305})(jQuery);