27.12.2016, 19:38
|
Интересующийся
|
|
Регистрация: 01.11.2016
Сообщений: 22
|
|
Некий калькулятор
Всем привет. Ребят, помогите реализовать след. вещь.
Есть набор input, checkbox и обычные text.
Собственно надо сделать некое суммирование.
К примеру, у меня есть форма которая состоит из 2х
<input type="text" id="text1"/>
<input type="text" id="text2"/>
и пару чекбоксов
<input type="checkbox" id="checkbox1"/>
<input type="checkbox" id="checkbox2"/>
Если к примеру мы ввели любые символы в id="text1", где то снизу в форме вывелось к примеру 25 (25-это вес этого инпута.)
Потом ввели во второе опять символы, и там где было 25, стало 75 (25+50 - 50 это вес второго поля.)
Потом жмякнули на чекбокс id="checkbox1" и сумма стала 85 (25 - вес первого поля, 50 - вес второго поля, + 10 - вес первого чекбокса.) - так же с вторым чекбоксом, и т.д.
Спасибо за ранее кто решится помочь мне.
|
|
27.12.2016, 20:22
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,124
|
|
простой калькулятор
admiral,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script>
window.addEventListener("DOMContentLoaded", function() {
var form = document.querySelector("#main"),
res = document.querySelector("#res"),
data = {
text1: 25,
text2: 50,
checkbox1: 10,
checkbox2: 10
};
function calc() {
res.innerHTML = Object.keys(data).reduce(function(sum, id) {
var elem = document.getElementById(id);
var key = elem.type == "text" ? elem.value.trim() : elem.checked;
return key ? sum + data[id] : sum
}, 0)
}
form.addEventListener("change", calc, false);
form.addEventListener("input", calc, false)
});
</script>
</head>
<body>
<form action="http://" id="main">
<input type="text" id="text1"/>
<input type="text" id="text2"/>
и пару чекбоксов
<input type="checkbox" id="checkbox1"/>
<input type="checkbox" id="checkbox2"/>
</form>
<div id="res"></div>
</body>
</html>
|
|
27.12.2016, 23:53
|
Интересующийся
|
|
Регистрация: 01.11.2016
Сообщений: 22
|
|
Спасибо огромное.
|
|
30.12.2016, 18:04
|
Интересующийся
|
|
Регистрация: 01.11.2016
Сообщений: 22
|
|
Всех с наступающим новым годом!
Я извиняюсь очень, но может поможете с еще одной задачкой?
Вот тут
return key ? sum - 20% + data[id] : sum
Как сделать что бы сумму выводило, с процентом, которым надо отнять от нее? я выше немного указал, просто - 20 получилось отнять от суммы, но вот с процентами беда(
|
|
30.12.2016, 18:37
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,124
|
|
admiral,
строка 26
}, 0) * .8
|
|
03.01.2017, 20:43
|
Интересующийся
|
|
Регистрация: 01.11.2016
Сообщений: 22
|
|
Спасибо огромное!) С Новым Годом!)
А можно еще один вопрос?
К примеру если мне надо добавить не просто число, а
data = {
text1: 25,
text2: 50,
checkbox1: 25%,
checkbox2: 10
};
Проценты?) Буду вам очень благодарен за помощь!)
|
|
03.01.2017, 21:08
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,124
|
|
admiral,
1. учитесь и придумывайте решения, пробуйте сами.
2.ваш пример ни о чём.
|
|
03.01.2017, 21:21
|
Интересующийся
|
|
Регистрация: 01.11.2016
Сообщений: 22
|
|
Да это понятно то ничем... просто я сколько перерыл интернета, нету ни единого даже примера.
|
|
03.01.2017, 22:01
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,124
|
|
admiral,
Цитата:
|
Василий Ивановач:
-Петька,приборы!
Петька:
-300!
Василий Иванович:
-Что 300?
Петька:
-А что приборы?
|
проценты чего? алгоритм сформулируйте понятный
|
|
03.01.2017, 22:29
|
Интересующийся
|
|
Регистрация: 01.11.2016
Сообщений: 22
|
|
Мы клацаем на text или checkbox, и в зависимости от нажатого, к общей сумме добавляется цифра которую мы внесем сюда
text1: 25,
text2: 50,
checkbox1: 10,
checkbox2: 10
т.е значения суммируются. А как сделать что бы если мы тыкнули на checkbox1, то добавилось не 10, как сейчас, а 25% от общей суммы результата.
|
|
|
|