Аннуитетный калькулятор на 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
 18 мая 2012 Ответить

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

,  24 мая 2012 Ответить

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

 26 мая 2012 Ответить

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

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

,  28 мая 2012 Ответить

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

,  12 января Ответить

Добрый день.

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

вставив его в документ между тегами скрипт туда, где Вы хотите расположить калькулятор
<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 для закрытия индексации?

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

,  23 мая 2013 Ответить

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


Советы по настройке онлайн-календаря под себя Советы по настройке онлайн-календаря
Что такое облачное хранилище и как им пользоваться? Что такое облачное хранилище и как им пользоваться?
Как выбрать пластины для теплообменника? Пластины для теплообменника
Изучение языка ECMAScript: основа современной веб-разработки История языка ECMAScript
Как добавить комментарий в HTML? HTML примеры
Apple позволит разработчикам распространять приложения напрямую с их сайтов Apple позволит разработчикам распространять приложения напрямую с их сайтов
jQuery 4.0 сокращает поддержку браузеров, удаляет API Новое в jQuery 4.0
Как продвинуть Telegram-канал: с нуля до результата Как продвинуть канал в Telegram с нуля?
Получить IT профессию с нуля: академия Eduson Получить IT профессию с нуля
Перспективы эволюции SEO: встречайте будущее продвижения в поисковых системах Будущее SEO-продвижения
Создание сайтов в Алматы: агентство site-promote.kz Разработка сайта компании
Антипкин Михаил Сергеевич о метавселенной, открывающей безграничные возможности для инноваций и экспериментов Антипкин Михаил Сергеевич о метавселенной
Сёрфинг с браузером FraudFox: исчерпывающее руководство Сёрфинг с браузером FraudFox
Где найти лицензионные ключи активации к ПО? Где найти лицензионные ключи активации к ПО?
Курсы веб дизайна: обучение онлайн Курсы веб дизайна: обучение онлайн
Как продлить срок службы бытовой техники? Как продлить срок службы бытовой техники?
Основы VPS/VDS: что нужно знать перед арендой? Основы VPS/VDS: что нужно знать перед арендой?
Откройте для себя азарт Mostbet KZ - ведущего онлайн-казино для геймеров Откройте для себя азарт Mostbet KZ - ведущего онлайн-казино для геймеров
Топ-10 игр для Android стоимостью менее $5 Топ-10 игр для Android стоимостью менее $5
Проверка авто в базе ГИБДД перед покупкой Проверка авто в базе ГИБДД перед покупкой