18.06.2014, 10:25
|
|
Интересующийся
|
|
Регистрация: 18.06.2014
Сообщений: 17
|
|
|
Вывод результата расчета по Кнопке
Добрый день , никак не могу прикрутить кнопку, не хочет она и все рассчитывать по кнопке.
Сам Скрипт
$(function () {
$("#amount_slider").slider({
orientation: "horizontal",
range: false,
min: 10000,
max: 2000000,
value: 100000,
step: 1000,
slide: function (event, ui) {
$("#amount").text(ui.value);
calculatePayment()
}
});
$("#amount").text($("#amount_slider").slider("value"));
$("#time_slider").slider({
orientation: "horizontal",
range: false,
min: 0,
max: 64,
value: 6,
step: 6,
slide: function (event, ui) {
$("#time").text(ui.value);
calculatePayment()
}
});
$("#time").text($("#time_slider").slider("value"));
function calculatePayment() {
var amount = $("#amount_slider").slider("value");
var interest = $("select#my_select").val() / 100;
var time = $("#time_slider").slider("value") * 1;
var rate = amount * (interest * Math.pow(1 + interest, time)) / (Math.pow(1 + interest, time) - 1);
$("#result").text(rate.toFixed(2));
}
calculatePayment()
});
Это ХТМЛ,
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="js/loan.js"></script>
<link rel="stylesheet" href="css/jquery-ui-1.8.16.custom.css" />
<title>Кредитный калькулятор</title>
</head>
<body>
<style type="text/css">
#amount_slider, #interest_slider, #time_slider
{
width: 200px;
margin-top: 20px;
float: left;
}
#amount, #interest, #time, #result {
margin-left: 20px;
margin-top: 20px;
float: left; }
#result {
font-weight: bold; }
.message { float: left;
margin-top: 20px;
font-family:Arial;
width: 100px; }
.clear { clear: both; }
</style>
<div>
<div class="message">Сумма кредита</div><div id="amount_slider"></div><div id="amount"> </div>
<div class="clear"></div>
<select id="my_select" name="my_select">
<option value="12">Авто</option>
<option value="10">Недвижимость</option>
<option value="15">Экспресс</option>
</select>
<div class="clear"></div>
<div class="clear"></div> <div class="message">Срок (мес)</div><div id="time_slider"></div>
<div id="time"></div>
<div class="clear"></div> <div class="message">Платеж в месяц</div><div id="result"></div>
<div class="clear"></div>
<br />
</body>
</html>
При таком коде работает все , тока результат сразу на странице отображается в Диве Result, он вызывается после каждого сдвига ползунка , calculatePayment()
а также после расчета
calculatePayment(),
А мне надо что бы я выставил значения , нажал на кнопку и вышел расчет в том же Диве Result
Делал кнопку добавлением в ХТМЛ
<div onClick="calculatePayment();" style="cursor:hand;cursor:pointer;">Рассчитать</div>
И соответственно в JS убирал
calculatePayment()
Но расчет не идет ..
Пробовал так же
Button прописовать в хтмл , c onClick="calculatePayment() нет результата,
|
|
18.06.2014, 10:50
|
 |
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,109
|
|
|
zeusrvp,
в строке 40 скрипта поставьте клик на див иначе функция calculatePayment из вне недоступна... ферштейн?
|
|
18.06.2014, 11:43
|
|
Интересующийся
|
|
Регистрация: 18.06.2014
Сообщений: 17
|
|
Сообщение от рони
|
zeusrvp,
в строке 40 скрипта поставьте клик на див иначе функция calculatePayment из вне недоступна... ферштейн?
|
я попытался не вышло ,
Вас бы не затруднило привести пример , по данному коду,
Допустим что я назначил Диву на который нажимают
id = raschet
тогда в JS мне надо
var raschet = document.getElementById("raschet");
raschet.onclick = что тут мне вписать , пробывал разные варианты не проканало , может как о все это можно сократить ?
Спасибо. |
|
18.06.2014, 11:49
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,109
|
|
zeusrvp,
raschet.onclick = calculatePayment;
|
|
18.06.2014, 12:00
|
|
Интересующийся
|
|
Регистрация: 18.06.2014
Сообщений: 17
|
|
|
Сообщение от рони
|
zeusrvp,
raschet.onclick = calculatePayment;
|
Что то не идет не хочет (((
Сейчас вот так
function calculatePayment() {
var amount = $("#amount_slider").slider("value");
var interest = $("select#my_select").val() / 100;
var time = $("#time_slider").slider("value") * 1;
var rate = amount * (interest * Math.pow(1 + interest, time)) / (Math.pow(1 + interest, time) - 1);
$("#result").text(rate.toFixed(2));
var raschet = Document.getElementById("raschet");
raschet.onclick = calculatePayment();
}
Везде убрал calculatePayment() что бы сам не считал автоматом..
Диву в html так прописал
<div id="raschet" style="cursor:hand;cursor:pointer;">Рассчитать</div></div>
  |
|
18.06.2014, 12:04
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,109
|
|
|
zeusrvp,
это типа строка 40 -- нетрогайте функцию -- ставьте ваши строки ниже функции
|
|
18.06.2014, 12:10
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,109
|
|
zeusrvp,
$(function () {
$("#amount_slider").slider({
orientation: "horizontal",
range: false,
min: 10000,
max: 2000000,
value: 100000,
step: 1000,
slide: function (event, ui) {
$("#amount").text(ui.value);
calculatePayment()
}
});
$("#amount").text($("#amount_slider").slider("value"));
$("#time_slider").slider({
orientation: "horizontal",
range: false,
min: 0,
max: 64,
value: 6,
step: 6,
slide: function (event, ui) {
$("#time").text(ui.value);
// calculatePayment()
}
});
$("#time").text($("#time_slider").slider("value"));
function calculatePayment() {
var amount = $("#amount_slider").slider("value");
var interest = $("select#my_select").val() / 100;
var time = $("#time_slider").slider("value") * 1;
var rate = amount * (interest * Math.pow(1 + interest, time)) / (Math.pow(1 + interest, time) - 1);
$("#result").text(rate.toFixed(2));
}
//calculatePayment()
var raschet = document.getElementById("raschet");
raschet.onclick = calculatePayment;
});
|
|
18.06.2014, 12:37
|
|
Интересующийся
|
|
Регистрация: 18.06.2014
Сообщений: 17
|
|
Спасибо огромное все вышло ) , 
Я вам просто кусок кода привел выше ) я не трогал весь код ,
Совсем заработался. )
Спасибо Вам еще раз.
Последний раз редактировалось zeusrvp, 18.06.2014 в 12:41.
|
|
20.06.2014, 13:32
|
|
Интересующийся
|
|
Регистрация: 18.06.2014
Сообщений: 17
|
|
Подскажите , как по моему коду, сделать
Отображение Ползунков только при выборе Программы
<select id="my_select" name="my_select">
<option value="12">Авто</option>
<option value="10">Недвижимость</option>
<option value="15">Экспресс</option>
</select>
И как сделать что бы при выборе например Авто
Значения менялись
Например так
Если выбрано Авто , то
$("#amount_slider").slider({
orientation: "horizontal",
range: false,
min: 100,
max: 200,
value: 100000,
step: 10000,
slide: function (event, ui) {
$("#amount").text(ui.value);
//calculatePayment()
}
});
$("#amount").text($("#amount_slider").slider("value"));
Если выбрана Недвижомость то
$("#amount_slider").slider({
orientation: "horizontal",
range: false,
min: 1000000,
max: 2000000,
value: 100000,
step: 10000,
slide: function (event, ui) {
$("#amount").text(ui.value);
//calculatePayment()
}
});
$("#amount").text($("#amount_slider").slider("value"));
|
|
20.06.2014, 13:51
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,109
|
|
zeusrvp,
для начала - минимум 100 максимум 200 откудаже value стотысяч и шаг 10000
читайте медитируйте над документацией на Ползунок UI
и может в раздел работа если быстро нужно? или пробуйте писать код ...
Здравствуйте!
Судя по вашему сообщению, вы ну совсем не знаете javascript.
Освойте основы языка и вопрос отпадет сам, полностью или частично.
А с чем не справитесь - поможем.
На сайте javascript можно начать изучать с учебника, раздел Основы javascript.
Возможно, вам также понадобится HTML - учебник есть, например, здесь: http://ru.html.net/tutorials/html/
Задавайте конкретные вопросы по ходу дела.
|
|
|
|
