Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Как создать калькулятор следующего вида? (https://javascript.ru/forum/dom-window/57000-kak-sozdat-kalkulyator-sleduyushhego-vida.html)

blogivan 14.07.2015 18:33

Как создать калькулятор следующего вида?
 
Помогите с кодом для калькулятора. Для вас это простота а я уже второй день мучаюсь :(

https://4.downloader.disk.yandex.ru/...&size=1249x539

Только начинаю изучать js. Сколько не бился - не получается хоть ты тресни( Помогите кто может.

Нужно чтоб код html был примерно таким.

<span id="x1"></span>*<input type="text" id="vvod1"/>=<span id="y1"></span>
<span id="x2"></span>*<input type="text" id="vvod2"/>=<span id="y2"></span>
<span id="x3"></span>*<input type="text" id="vvod3"/>=<span id="y3"></span>
<span id="summa_vseh_y"></span>

jackdempsey2015 14.07.2015 18:49

blogivan,
ссылка нерабочая. Пости код сюда, или на jsfiddle, думаешь кому то нравиться скачивать и распоковывать чужое дерьмо?

blogivan 14.07.2015 19:02

Число1 * Инпут1 = произведение1
Число2 * Инпут2 = произведение2
Число3 * Инпут3 = произведение3

Итого: произведение1 + произведение2 + произведение3

blogivan 14.07.2015 19:04

http://remont-kvartir24.net/%D0%BA%D...2%D0%BE%D1%80/

Что то подобное на сайте

jackdempsey2015 14.07.2015 19:07

Цитата:

Сообщение от blogivan
Число1

Не вижу, откуда эти числа беруться.

blogivan 14.07.2015 19:16

К примеру:
В коде хтмл прописали спан с конкретным числом (ценой).
Например цена чего нить там равна 100.
После спана пишем инпут в который пользователь вводит количество товара. Далее пишем спан в который должно вывестись произведение вышеупомянутых.

В кратце вот: Число1 * Инпут1 = произведение1

Блоков несколько для нескольких товаров.

После всех блоков нужно в спан вывести сумму всех товаров.

jackdempsey2015 14.07.2015 19:28

Все мне некогда. Если никто не ответит, отвечу примерно через час

blogivan 14.07.2015 19:31

И на том спасибо!:yes:

jackdempsey2015 14.07.2015 21:13

вот простой вариант без проверки полей
<html>
<head>
<meta charset="utf-8">
 <style>
   .goods{display: block}
 </style>
</head>
<span class="goods" price="10">введите количество товара<input><span>
<span class="goods" price="20">введите количество товара<input><span>
<span class="goods" price="30">введите количество товара<input><span>

<button id="b">посчитать</button>

<div id="out"></div>

<script>


goods=[].map.call(document.querySelectorAll(".goods"), function(x){return x})

prices=goods.map(function(x){return +x.getAttribute("price")})


count=function(arr1, arr2){
 
 var arr=[]
 for(var i=0; i<arr1.length; i++) arr.push(arr1[i]*arr2[i])
 return arr.reduce(function(x, y){return x + y})
}

b.onclick=function(){
 var numbers=goods.map(function(x){return +x.querySelector("input").value})
 out.innerHTML=count(numbers, prices)
}




</script>
</html>

kostyanet 14.07.2015 21:40

Цитата:

Сообщение от jackdempsey2015
вот простой вариант

Несомненно ТС захочет как у людей или получше, и было бы интересно посмотреть способны ли расти такие коды как у вас до размеров аппа с сохранением хотя бы минимальной вменяемости.


Часовой пояс GMT +3, время: 08:06.