Создание калькулятора

@ansi_str · Регистрация: 22.09.2011

Студворк — интернет-сервис помощи студентам

Здравствуйте, хочется сделать калькулятор
Он будет ссостоять из таблицы - внутри таблицы две колонки
В первой колонке чекбоксы, во второй колонке метки с числами
Как сделаь так, чтобы при выборе(чекбок.чекд) общая сумма изменялась?
То есть чекбоксы работли бы как кнопка и изменяли иоговую сумму?

@parikmaher534 · 13.12.2011, 15:11

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>
    <body>
        <input value="0" id="total">
        <div id="wrapper">
            <input type="checkbox" value="23" id="some">
            <input type="checkbox" value="63" id="some2">
        </div>
        <script>

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
            window.onload = function(){
              var wrapper = document.getElementById("wrapper"),
                  total   = document.getElementById("total"),
                  sum     = parseInt(total.value)
                  
              wrapper.onclick = function(e){
                  if( e.target.checked ){
                      switch(e.target.id){
                          case "some":
                             sum += parseInt(e.target.value);
                             total.value = sum; 
                             break;
                          case "some2":
                             sum += parseInt(e.target.value)/34;
                             total.value = sum; 
                             break;
                      };
                  };
              };
            };

HTML5
1
2
3
        </script>
    </body>
</html>

Числа от балды))

В switch можете описать логику для любого чекбокса

@ansi_str · 13.12.2011, 15:28 **[ТС]**

А если код у страницы ASP.NET, где мясорубка серверного и клиенского и по document.getElementById(), ничего не находится - как нуль был, так и остаётся? Что тогда делать?

@parikmaher534 · 13.12.2011, 15:36

Если вы выполните JS код после загрузки всей страницы. И Элемент с таким id существует то вам вернется элемент. Если не вернется то нет такого айдишника

@ansi_str · 13.12.2011, 15:41 **[ТС]**

HTML5
1
2
<td><b>Итого:<input type="hidden" name="tot_pr" value="" id="total_pr" /></b></td>
<td align="center" id="total_price">0</td>

Ищу как:

JavaScript
1
2
 document.getElementById("total_price").innerHTML = 12;
 document.getElementById("total_pr").value = 12;

Но не находится...

@parikmaher534 · 13.12.2011, 15:54

попробуйте:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>
    <body>
        <table>
            <tr>
                <td><b>Итого:<input type="hidden" name="tot_pr" value="111" id="total_pr" /></b></td>
                <td align="center" id="total_price">0</td>
            </tr>
        </table>
        <script>

JavaScript
1
2
3
4
5
6
            window.onload = function(){
              var val_el   = document.getElementById("total_pr"),
                  place_el = document.getElementById("total_price")
              
              place_el.innerHTML = val_el.value;
            };

HTML5
1
2
3
        </script>
    </body>
</html>

@ansi_str · 13.12.2011, 16:04 **[ТС]**

Неа, не работает.....

@parikmaher534 · 13.12.2011, 16:07

хм... А у вас эти элементы случайно не JS-ом генерируются?

@ansi_str · 13.12.2011, 16:16 **[ТС]**

Нет, не Js генерируются
А если элемент находится внутри нескольких серверных контролов, то его всё равно искать с помощью document.getElementById()?

@parikmaher534 · 13.12.2011, 16:19

а в серверном контроле это что значит?
Если они лежат в iframe то доступ по другому реализуется

@ansi_str · 13.12.2011, 16:25 **[ТС]**

В серверном - значит:
Я использую ASP.NET
Он лежит внутри Грида(внутри колонки)
Грид - серверный контрол

@parikmaher534 · 13.12.2011, 16:33

а можете скопировать содержимое лаяута уже на стороне клиента

@GuardCat · 13.12.2011, 16:35

Это форум javascript.
Не форум ASP.Net
Здесь не все знают что такое Грид.
Таким образом, вам с большей вероятностью помогут, если вы выложите ту разметку, которую получает пользователь (не серверный код) или её часть. Конечно, вероятность того, что вам помогут, увеличится, если вы бьютифайезируете (например, используя этот сервис) разметку.

@ansi_str · 14.12.2011, 11:04 **[ТС]**

Прошёлся дебаггером по коду клиентскому.

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<script language="javascript" type="text/javascript" >
                                        function discount() 
                                        {
                                            if(paperCart.checked)
                                                var paperDiscount = paperCart.value;
                                            else
                                                paperDiscount = 0;
                                                
                                            if(redCart.checked)
                                                var redDiscount = redCart.value;
                                            else
                                                redDiscount = 0;
                                                
                                            if(silverCart.checked)
                                                var silverDiscount = silverCart.value;
                                            else
                                                silverDiscount = 0;
                                                
                                            if(goldCart.checked)
                                                var goldDiscount = goldCart.value;
                                            else
                                                goldDiscount = 0;
                                                
                                            if(platinumCart.checked)
                                                var platinumDiscount = platinumCart.value;
                                            else
                                                platinumDiscount = 0;
 
                                            var totalDiscount = paperDiscount + redDiscount + silverDiscount + goldDiscount + platinumDiscount;
 
                                            $('#total_pr').val(totalDiscount);
                                        }                                    
</script>

HTML5
1
2
3
4
5
6
7
<table style="width: 250px" >
                            <tr>
                                <td>
                                    <input type="checkbox" name="paperCart" />
                                    <br />
                                </td>
........

Но почему то не находит чекбокс...
Ошибка выполнения Microsoft JScript: 'paperCart' - определение отсутствует

Добавлено через 1 час 12 минут
Прописал всё через id - всё заработало
Но почему то при изменении значния в элементе input, оно не изменяется....

JavaScript
1
2
3
4
5
<td style="font-size: 12px">
                                        <label class="label" style="width: 150px">Сумма изделия:
                                        <input type="hidden" name="sum_with_discount" value="0" id="sum_with_discount" />
                                        руб.</label>
                                    </td>

JavaScript
1
$('#discount_value').val(totalDiscount);

@parikmaher534 · 14.12.2011, 12:06

Ну так блин ясень пень что id и атрибут name не одно и тоже)))
Вот так вот надо было -

JavaScript
1
$('input[name="paperCart"]')

А в инпуте ничего не меняется небось потомучто и там не так селектором ищите)

@ansi_str · 15.12.2011, 08:45 **[ТС]**

Не, не....Как раз в поиске по id я раозбрался, делаю так:

JavaScript
1
2
3
4
if ($('#platinumCart').attr('cheked'))
       var redDiscount = $('#platinumCart').val()
else
      platinumDiscount = 0;

А изменяю value по id:

Java
1
2
$('#discount_value').val(totalDiscount);
var d = $('#discount_value').val();

А разница сильно большая - если обращаться через id или name, изменяя значение value?

Добавлено через 25 минут
При дебаге смотрю значения:

JavaScript
1
2
$('input[id="discount_value"]').val(totalDiscount);
var d = $('input[id="discount_value"]').val();

Сначала запихиваю в value значение, а затем смотрю - что запихнулось, но почему то в value как был нуль, так и остался...
Извините что туплю...Но я впервые с Js работаю

Добавлено через 24 минуты
Но в перменной d - значение временное изменилось

@ansi_str · 16.12.2011, 14:48 **[ТС]**

Всем спасибо - всё работет

Новые блоги и статьи Все статьи Все блоги /
Кто-нибудь знает, где можно бесплатно получить настольный компьютер или ноутбук? США. Programma_Boinc 26.12.2025 Нашел на реддите интересную статью под названием Anyone know where to get a free Desktop or Laptop? Ниже её машинный перевод. После долгих разбирательств я наконец-то вернула себе. . .	Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка. Programma_Boinc 23.12.2025 Рецензия / Мнение/ Перевод Нашел на реддите интересную статью под названием The Thinkpad X220 Tablet is the best budget school laptop period . Ниже её машинный перевод. Thinkpad X220 Tablet —. . .	PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Как объединить две одинаковые БД Access с разными данными VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.	Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro
Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .	От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .	Поиск "дружественных имён" СОМ портов Argus19 22.11.2025 Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .	Сколько Государство потратило денег на меня, обеспечивая инсулином. Programma_Boinc 20.11.2025 Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .	Ломающие изменения в C#.NStar Alpha Etyuhibosecyu 20.11.2025 Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .

@ansi_str 57 / 57 / 15 Регистрация: 22.09.2011 Сообщений: 319

	Создание калькулятора 13.12.2011, 14:19. Показов 6624. Ответов 16 Метки нет (Все метки) Здравствуйте, хочется сделать калькулятор Он будет ссостоять из таблицы - внутри таблицы две колонки В первой колонке чекбоксы, во второй колонке метки с числами Как сделаь так, чтобы при выборе(чекбок.чекд) общая сумма изменялась? То есть чекбоксы работли бы как кнопка и изменяли иоговую сумму? 0

@ansi_str 57 / 57 / 15 Регистрация: 22.09.2011 Сообщений: 319
	13.12.2011, 15:28 [ТС]
	А если код у страницы ASP.NET, где мясорубка серверного и клиенского и по document.getElementById(), ничего не находится - как нуль был, так и остаётся? Что тогда делать? 0

@parikmaher534 38 / 38 / 6 Регистрация: 16.11.2011 Сообщений: 112
	13.12.2011, 15:36
	Если вы выполните JS код после загрузки всей страницы. И Элемент с таким id существует то вам вернется элемент. Если не вернется то нет такого айдишника 0

@ansi_str 57 / 57 / 15 Регистрация: 22.09.2011 Сообщений: 319
	13.12.2011, 16:04 [ТС]
	Неа, не работает..... 0

@parikmaher534 38 / 38 / 6 Регистрация: 16.11.2011 Сообщений: 112
	13.12.2011, 16:07
	хм... А у вас эти элементы случайно не JS-ом генерируются? 0

@ansi_str 57 / 57 / 15 Регистрация: 22.09.2011 Сообщений: 319
	13.12.2011, 16:16 [ТС]
	Нет, не Js генерируются А если элемент находится внутри нескольких серверных контролов, то его всё равно искать с помощью document.getElementById()? 0

@parikmaher534 38 / 38 / 6 Регистрация: 16.11.2011 Сообщений: 112
	13.12.2011, 16:19
	а в серверном контроле это что значит? Если они лежат в iframe то доступ по другому реализуется 0

@ansi_str 57 / 57 / 15 Регистрация: 22.09.2011 Сообщений: 319
	13.12.2011, 16:25 [ТС]
	В серверном - значит: Я использую ASP.NET Он лежит внутри Грида(внутри колонки) Грид - серверный контрол 0

@parikmaher534 38 / 38 / 6 Регистрация: 16.11.2011 Сообщений: 112
	13.12.2011, 16:33
	а можете скопировать содержимое лаяута уже на стороне клиента 0

@GuardCat Просто любитель 626 / 464 / 120 Регистрация: 20.01.2011 Сообщений: 865 Записей в блоге: 2
	13.12.2011, 16:35
	Это форум javascript. Не форум ASP.Net Здесь не все знают что такое Грид. Таким образом, вам с большей вероятностью помогут, если вы выложите ту разметку, которую получает пользователь (не серверный код) или её часть. Конечно, вероятность того, что вам помогут, увеличится, если вы бьютифайезируете (например, используя этот сервис) разметку. 0

@ansi_str 57 / 57 / 15 Регистрация: 22.09.2011 Сообщений: 319
	16.12.2011, 14:48 [ТС]
	Всем спасибо - всё работет 0