Некий калькулятор
Всем привет. Ребят, помогите реализовать след. вещь.
Есть набор 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 - вес первого чекбокса.) - так же с вторым чекбоксом, и т.д. Спасибо за ранее кто решится помочь мне. |
простой калькулятор
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>
|
Спасибо огромное.
|
Всех с наступающим новым годом!
Я извиняюсь очень, но может поможете с еще одной задачкой? Вот тут return key ? sum - 20% + data[id] : sum Как сделать что бы сумму выводило, с процентом, которым надо отнять от нее? я выше немного указал, просто - 20 получилось отнять от суммы, но вот с процентами беда( |
admiral,
строка 26 }, 0) * .8 |
Спасибо огромное!) С Новым Годом!)
А можно еще один вопрос? :-? К примеру если мне надо добавить не просто число, а data = { text1: 25, text2: 50, checkbox1: 25%, checkbox2: 10 }; Проценты?) Буду вам очень благодарен за помощь!) |
admiral,
:-? 1. учитесь и придумывайте решения, пробуйте сами. 2.ваш пример ни о чём. |
Да это понятно то ничем... просто я сколько перерыл интернета, нету ни единого даже примера.
|
admiral,
Цитата:
|
Мы клацаем на text или checkbox, и в зависимости от нажатого, к общей сумме добавляется цифра которую мы внесем сюда
text1: 25, text2: 50, checkbox1: 10, checkbox2: 10 т.е значения суммируются. А как сделать что бы если мы тыкнули на checkbox1, то добавилось не 10, как сейчас, а 25% от общей суммы результата. |
| Часовой пояс GMT +3, время: 12:22. |