Войти Регистрация

Аннуитетный калькулятор на JavaScript

Данный калькулятор Javascript позволяет рассчитать ежемесячные выплаты по кредиту. Расчеты выплат в скрипте производятся с использованием коэффициента аннуитета (или фиксированных выплат каждый месяц). Коэффициент рассчитывается по формуле а = p * (1+p)^term / ((1+p)^term-1), где: а - коэффициент аннуитета; р — сотая доля годовой процентной ставки в месяц; term — количество месяцев, на которое оформляется кредит; Используя коэффициент аннуитета, вычисляем размер ежемесячного платежа: month_p=a*sum, где sum - полная сумма кредита; вычисляем общую сумму платежей за весь период выплат: total_p=term*month_p; размер переплаты по кредиту: over_p=total_p-sum;

Создаем блоки для получения информации от пользователя и вывода результатов расчетов:


var body = document.getElementsByTagName("body")[0]; //получаем body для добавления к нему новых элементов
var cont = document.createElement("div"); //создаем контейнер div
var div_p = document.createElement("div"); //создаем div для текстовой информации;
var div_f = document.createElement("div"); //создаем div для элементов form
body.appendChild(cont); //добавляем созданные "дивы" в документ
cont.appendChild(div_p);
cont.appendChild(div_f);

Немного оформляем внешний вид с помощью css:


cont.style.width = 520;
cont.style.height = 200;
cont.style.position = 'absolute';
cont.style.border = 'outset';
div_p.style.width = '50%';
div_p.style.position = 'absolute';
div_p.style.Float = 'left';
div_p.style.marginTop = 20;
div_p.style.marginLeft = 20;
div_f.style.Float = 'right';
div_f.style.marginTop = 20;
div_f.style.marginLeft = 280;
div_f.style.width = '50%';
div_f.style.position = 'relative';

Заполняем блоки div_p и div_f содержанием:


div_p.innerHTML = "Сумма кредита:<br>Общий годовой процент по кредиту:<br>Срок кредита:<br><br><br>"+
"Ваш ежемесячный платеж:<br>Общая сумма платежей:<br>Переплата по кредиту составляет:";

div_f.innerHTML = "<form name='credit'><input name='sum' type='text' value='' size=12>"+
"<select type='menu' name='usr' id='curr'><option value='rub'> руб.<option value='USD'>долл."+
"<option value='Eur'>евро</select><br><input name='perc' type='text' value='' size=12>%<br>"+
"<input type='text' value='' name='term' size=12><select type='menu' name='ust' id='ust'>"+
"<option value='month'>  мес.<option value='year'>  год</select>"+
"</form><button onclick='count()' value='' style='float:left; margin-top:-10'>Считать</button><br>"+
"<form name='result'  ><input name='month_p' type='text' value='' size=24 ' onfocus='this.blur()'><br>"+
"<input name='total_p' type='text' value='' size=24 onfocus='this.blur()'><br>"+
"<input name='over_p' onfocus='this.blur()'type='text' value='' size=24>";

Создаем функцию для выполнения вычислений:


function count() {
	var sum = document.credit.sum.value;
	var perc = document.credit.perc.value;
	var i = new Array(1,12);
	var term=document.credit.term.value*i[document.credit.ust.selectedIndex]; //получаем количество месяцев
		
		var p=perc/1200;//сотая доля годового процента по кредиту
				
		var a=p*Math.pow((1+p),term)/(Math.pow((1+p),term)-1); //высчитываем коэффициент
		a=(Math.ceil(a*10000))/10000; //округляем полученное значение 
		
		var month_p = a * sum;
		var total_p = term * month_p;
		var over_p = total_p-sum;
		var sel_val = new Array ("рублей", "долларов", "евро");
		var val=sel_val[document.credit.usr.selectedIndex]; //добавляем название валюты к результату
		
		document.result.month_p.value = (Math.round(month_p*100))/100+" "+val;
		document.result.total_p.value = (Math.round(total_p*100))/100+" "+val;
		document.result.over_p.value = (Math.round(over_p*100))/100+" "+val;
		
}

Оформление калькулятора практически отсутствует, поскольку оно должно быть выполнено в едином стиле с основным дизайном сайта. Оформить калькулятор используя css, все необходимые id или class можно дописать в скрипт. Если что-то не будет получаться, пишите в комментариях, постараюсь помочь.
Весь скрипт целиком:


var body = document.getElementsByTagName("body")[0];
var cont = document.createElement("div");
var div_p = document.createElement("div");
var div_f = document.createElement("div");
body.appendChild(cont);
cont.appendChild(div_p);
cont.appendChild(div_f);

cont.style.width = 520;
cont.style.height = 200;
cont.style.position = 'absolute';
cont.style.border = 'outset';
div_p.style.width = '50%';
div_p.style.position = 'absolute';
div_p.style.Float = 'left';
div_p.style.marginTop = 20;
div_p.style.marginLeft = 20;
div_f.style.Float = 'right';
div_f.style.marginTop = 20;
div_f.style.marginLeft = 280;
div_f.style.width = '50%';
div_f.style.position='relative';

div_p.innerHTML = "Сумма кредита:<br>Общий годовой процент по кредиту:<br>Срок кредита:<br><br><br>"+
"Ваш ежемесячный платеж:<br>Общая сумма платежей:<br>Переплата по кредиту составляет:";

div_f.innerHTML = "<form name='credit'><input name='sum' type='text' value='' size=12>"+
"<select type='menu' name='usr' id='curr'><option value='rub'> руб.<option value='USD'>долл."+
"<option value='Eur'>евро</select><br><input name='perc' type='text' value='' size=12>%<br>"+
"<input type='text' value='' name='term' size=12><select type='menu' name='ust' id='ust'>"+
"<option value='month'>  мес.<option value='year'>  год</select>"+
"</form><button onclick='count()' value='' style='float:left; margin-top:-10'>Считать</button><br>"+
"<form name='result'  ><input name='month_p' type='text' value='' size=24 ' onfocus='this.blur()'><br>"+
"<input name='total_p' type='text' value='' size=24 onfocus='this.blur()'><br>"+
"<input name='over_p' onfocus='this.blur()'type='text' value='' size=24>";

function count() {
	var sum = document.credit.sum.value;
	var perc = document.credit.perc.value;
	var i = new Array(1,12);
	var term = document.credit.term.value*i[document.credit.ust.selectedIndex];
		
		var p = perc/1200;
				
		var a = p*Math.pow((1+p),term)/(Math.pow((1+p),term)-1); //Math.pow - возведение в степень (арг-т, степень)
		a = (Math.ceil(a*10000))/10000;
		
		var month_p = a*sum;
		var total_p = term*month_p;
		var over_p = total_p-sum;
		var sel_val = new Array ("рублей", "долларов", "евро");
		var val = sel_val[document.credit.usr.selectedIndex];
		
		document.result.month_p.value = (Math.round(month_p*100))/100+" "+val;
		document.result.total_p.value = (Math.round(total_p*100))/100+" "+val;
		document.result.over_p.value = (Math.round(over_p*100))/100+" "+val;
		
}

Комментировать

captcha

  #1 / Гость
18 мая 2012 / Ответить  

Добрый день! не могли бы подсказать формулу расчета дифференцированных платежей? Заранее благодарен!

  #2 / freeden
24 мая 2012 / Ответить  

Размер месячного платежа = (ОСЗ / Кол. месяцев) + (ОСЗ х ПрС х Кол. дней в месяце / Кол. дней в году)
где, ОСЗ - остаток ссудной задолженности на дату расчета. (На дату выдачи кредита он равен размеру выданного кредита) ПрС - процентная ставка.

  #3 / Гость
26 мая 2012 / Ответить  

Добрый день.
Жаль не умею править эти скрипты, ваш исходник воткнул на свой сайт, естественно получил абракадабру. Может вы выложите готовый код универсального кредитного калькулятора? А цвет я уж поменяю в месте с шрифтами.

PS: Все одно, нас таких неумек больше чем опытных программистов, которые и сами могут что то подобное написать как вы. Извиняюсь за много слов.

  #4 / freeden
28 мая 2012 / Ответить  

Уважаемый гость, данный скрипт можно запустить вставив его в документ между тегами скрипт туда, где Вы хотите расположить калькулятор. Проблем обычно не возникает. Но, на всякий случай, - мой электронный адрес freeden_codomaza@mail.ru описание проблемы, а также предложения по кастомизации скрипта под Ваш сайт можете кидать туда.

  #5 / goldgraff
23 мая 2013 / Ответить  

Добрый день.

Калькулятор то что нужно, но для простого человека объясните пожалуйста (извиняюсь за глупый вопрос), 

вставив его в документ между тегами скрипт туда, где Вы хотите расположить калькулятор

<script type="text/javascript"> ----------------  </script>

Так я понимаю?

При вставке на страницу WP (в код разумеется), калькулятор отображается, но сползает в футер. И еще, подсветка кода, при вставке в блокноте, не такая как при подсветке javascript, значит какая нестыковка, а мне не програмеру понять блин сложно, подскажите пожалуйста.

И еще вопрос, т.к. тут собрались профессионалы, вот кусок кода, вывода меню рубрик на wordpress


function themater_menu_secondary_default()
{
global $theme;
?>

<div class="<?php echo $theme->options['menus']['menu-secondary']['wrap_class']; ?>">
<ul class="<?php echo $theme->options['menus']['menu-secondary']['menu_class']; ?>">
<?php wp_list_categories('depth=' . $theme->get_option('menu_secondary_depth') . '&hide_empty=0&orderby=name&show_count=0&use_desc_for_title=1&title_li='); ?>
</ul>
</div>

<?php

Как вставить и куда nofollow для закрытия индексации?

Заранее спасибо!

  #6 / freeden
23 мая 2013 / Ответить  

goldgraff, в вашем случае (по поводу скрипта) сделайте в документе в ручную разметку div'ами и формами, стили естественно в style.css добавьте (или что там у вас). Потом добавьте скрипт JS, предварительно установив плагин inline-js (http://www.ooso.net/index.php/inline-js) - плагин для добавления скриптов в WP. Если не получится скиньте разметку на freeden_codomaza@mail.ru

Вход

Зарегистрируйтесь, если нет учетной записи

Восстановить пароль
Регистрация
Восстановить пароль
Войти в личный кабинет