Как быть с кнопками

@Дмитрий Дмитрий · Регистрация: 17.09.2016

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

Есть код

JavaScript
1
2
3
4
5
6
7
8
9
<script>
function myFunc(thisButton){
 var editbox1 = +document.getElementById('editbox1').value >= 0.4;
 var editbox2 = +document.getElementById('editbox2').value >=0.4; 
 var buttonValue = +thisButton.value;
 var wb_result = document.getElementById('wb_result');
 wb_result.innerHTML = (editbox1*editbox2*buttonValue).toFixed(2);
 };
</script>

в котором var buttonValue = +thisButton.value; учитывает все кнопки и умножает при onclick="myFunc(this)" только ту кнопку на которую нажимаешь, а если необходимо умножить две или три разные кнопки, как быть?

@mrtoxas · 22.09.2016, 09:32

Это как? При нажатии на одну кнопку, умножается значение двух текстовых полей и value всех кнопок на странице?

@Дмитрий Дмитрий · 22.09.2016, 09:52 **[ТС]**

Неее))) Сейчас мы умножаем определенную кнопку при нажатии на эту окнопку, но надо умножить значение второй кнопки при нажатии на нее.
Может так
var button = 'button1';
wb_result.innerHTML = (editbox1*editbox2*buttonValue*button).t oFixed(2);
Чтобы умножалось значение каждой кнопки при ее нажатии. Оставляя buttonValue.

@j2FunOnly · 22.09.2016, 10:40

Дмитрий Дмитрий, соберитесь с мыслями. Приложите код HTML. Постарайтесь ясно формулировать свой вопрос.

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

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<div class="multiply-form">
  <div class="form-group">
    <label for="input-1">Значение 1</label>
    <input type="text" name="input_1" id="input-1" value="0">
  </div>
  <div class="form-group">
    <label for="input-2">Значение 1</label>
    <input type="text" name="input_2" id="input-2" value="0">
  </div>
  <div class="multiply-by">
    <button type="button" id="x2" onclick="multiplyValues(this)">2</button>
    <button type="button" id="x4" onclick="multiplyValues(this)">4</button>
  </div>
  <div id="multiply-result"></div>
</div>

JavaScript
1
2
3
4
5
6
var multiplyValues = function (thisBtn) {
  var value1 = parseInt(document.getElementById('input-1').value);
  var value2 = parseInt(document.getElementById('input-2').value);
  var result = value1 * value2 * parseInt(thisBtn.innerHTML);
  document.getElementById('multiply-result').innerHTML = result;
}

@Дмитрий Дмитрий · 22.09.2016, 12:01 **[ТС]**

Вот работающий код js

JavaScript
1
2
3
4
5
6
7
8
9
10
11
<script>
function myFunc(thisButton){
 var editbox1 = +document.getElementById('editbox1').value;
 var editbox2 = +document.getElementById('editbox2').value;
if(editbox1>=0.4&&editbox1<=3)
if(editbox2>=0.4&&editbox2<=3)
 var buttonValue = +thisButton.value;
 var wb_result = document.getElementById('wb_result');
 wb_result.innerHTML = (editbox1*editbox2*buttonValue).toFixed(2);
 };
</script>

Основная часть html кода, количество button id="AdvancedButton n"

HTML5
1
2
3
4
5
6
<input type="number" id="editbox1" style="" name="Ширина изделия" value="0.4" autocomplete="off" title="">
<input type="number" id="editbox2" style="" name="Высота изделия" value="0.4" autocomplete="off" title="">
<button id="AdvancedButton1" type="button" style="" name="la" value="500" onclick="myFunc(this)">
<div style="text-align:center"></div>
</button>
<div id="wb_result" style="" class="h1"></div>

Сейчас работает так:
-вводим в editbox1 число от 0,4 до 3; вводим в editbox2 число 0,4 до 3.
-нажимаем любую кнопку button id="AdvancedButton n". которой присвоено число value="n" .
- в поле wb_result выводится результат формулы wb_result.innerHTML = (editbox1*editbox2*buttonValue).toFixed( 2);

Я понимаю так, что переменная var buttonValue определяет кнопку и при нажатии на нее значение value="n" идет в формулу. Но это для всех кнопок, а если мне нужно что бы в формулу подставлялись значения определенной кнопки при её нажатии, это может быть и 2 и 3 кнопки, что то типо этого
wb_result.innerHTML = (editbox1*editbox2*buttonValue1*buttonVa lue2...*buttonValuen).toFixed(2);

@j2FunOnly · 22.09.2016, 14:04

Сообщение от Дмитрий Дмитрий

если мне нужно что бы в формулу подставлялись значения определенной кнопки при её нажатии, это может быть и 2 и 3 кнопки, что то типо этого

Так и есть... при вызове onclick='myFunc(this)', в функцию передается this - то есть нажатая кнопка, и в теле функции идет обращение к ней

JavaScript
1
2
3
4
5
6
7
function myFunc(thisButton){
  // ...
  var buttonValue = +thisButton.value;
  var wb_result = document.getElementById('wb_result');
  
  wb_result.innerHTML = (editbox1 * editbox2 * buttonValue).toFixed(2);
 }

Добавлено через 2 минуты
Давно бы уже сами проверили:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
var myFunc = function (thisButton) {
  var editbox1 = document.getElementById('editbox1').value;
  var editbox2 = document.getElementById('editbox2').value;
  if(editbox1 >= 0.4 && editbox1 <= 3) {
    if(editbox2 >= 0.4 && editbox2 <= 3) {
      var buttonValue = parseFloat(thisButton.value);
      console.log(buttonValue);
      var wb_result = document.getElementById('wb_result');
      wb_result.innerHTML = (editbox1 * editbox2 * buttonValue).toFixed(2);
    }
  }
}

HTML5
1
2
3
4
5
6
7
8
9
10
11
<div class="multiply-form">
  <input type="number" id="editbox1" value="0.4" autocomplete="off">
  <input type="number" id="editbox2" value="0.4" autocomplete="off">
  <button id="AdvancedButton1" type="button" value="500" onclick="myFunc(this)">
    <div style="text-align:center">xxx 500</div>
  </button>
  <button id="AdvancedButton2" type="button" value="400" onclick="myFunc(this)">
    <div style="text-align:center">xxx 400</div>
  </button>
  <div id="wb_result" class="h1">result</div>
</div>

@Дмитрий Дмитрий · 22.09.2016, 14:35 **[ТС]**

Блин, как объяснить то)))
Вы мне дали этот же код, что и был, он добавляет только значение одной кнопки при её нажатии buttonValue, мне нужно добавлять в формулу несколько значений, нескольких кнопок, что то типо этого
wb_result.innerHTML = (editbox1*editbox2*buttonValue1*buttonVa lue2...*buttonValuen).toFixed(2);

@mrtoxas · 22.09.2016, 16:04

1. Вы нажимаете на первую кнопку, в переменную X заносится множество значенией двух полей и самой кнопки.
2. Вы нажимаете на вторую кнопку, переменная Х умножается на значение второй кнопки. То же самое происходит и со следующими кнопками.
Что должно происходить, если нажата сразу вторая кнопка? Умножать значения полей, нажатой кнопки и переходить к пункту 2?
Правильно?

@Дмитрий Дмитрий · 22.09.2016, 16:14 **[ТС]**

Если сразу нажата вторая то умножаем на значение второй кнопки, очередь не имеет значения, какая нажата первая или восьмая: поле1* поле2* кнопкуА*...кнопку n= результат, максимум используются две кнопки т.е. поле1* поле2*кнопкаА*кнопкаВ= результат.
Если не понятно скину рисунок)))

@mrtoxas · 22.09.2016, 16:32

Скидываете. А если какая-то из кнопок нажата два раза?

@mrtoxas · 26.09.2016, 19:56

C вашими кнопками я бы сделал так:

CSS
1
2
3
.addit-val{
  display:none; 
}

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<h3>Блок1</h3>
<div class="additForm">
  <label class="addit-label">100<input class="addit-val" value="100" type="checkbox" /></label>
  <label class="addit-label">200<input class="addit-val" value="200" type="checkbox" /></label>
  <label class="addit-label">300<input class="addit-val" value="300" type="checkbox" /></label>
</div>
<h3>Блок2</h3>
<div class="additForm">
  <label class="addit-label">400<input class="addit-val" value="400" type="checkbox" /></label>
  <label class="addit-label">500<input class="addit-val" value="500" type="checkbox" /></label>
  <label class="addit-label">600<input class="addit-val" value="600" type="checkbox" /></label>
</div>
<br />
<span id="res">Сумма:</span>

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
var sum = 0;
var additForm = document.getElementsByClassName('additForm');
var res = document.getElementById('res');
[].forEach.call(additForm, function(form) {
  form.addEventListener('click', function(event) {
    target = event.target;
    if (target.className == 'addit-val' && target.checked) {
      sum += +target.value;
      target.parentElement.style.fontWeight = 'bold';
    } else if (target.className == 'addit-val' && !target.checked) {
      sum -= +target.value;
      target.parentElement.style.fontWeight = 'normal';
    }
    res.innerHTML = 'Сумма: ' + sum;
  })
})

Результат

Добавлено через 1 минуту
Между ...addit-label"> и <input class... можете вставлять изображение

Новые блоги и статьи Все статьи Все блоги /
Идея фильтра интернета (сервер = слой+фильтр). Hrethgir 31.03.2026 Суть идеи заключается в том, чтобы запустить свой сервер, о чём я если честно мечтал давно и давно приобрёл книгу как это сделать. Но не было причин его запускать. Очумелые учёные напечатали на. . .	Модель здравосоХранения 6. ESG-повестка и устойчивое развитие; углублённый анализ кадрового бренда anaschu 31.03.2026 В прикрепленном документе раздумья о том, как можно поменять модель в будущем	10 пpимет, которые всегда сбываются Maks 31.03.2026 1. Чтобы, наконец, пришла маршрутка, надо закурить. Если сигарета последняя, маршрутка придет еще до второй затяжки даже вопреки расписанию. 2. Нaдоели зима и снег? Не надо переезжать. Достаточно. . .	Перемещение выделенных строк ТЧ из одного документа в другой Maks 31.03.2026 Реализация из решения ниже выполнена на примере нетипового документа "ВыдачаОборудованияНаСпецтехнику" с единственной табличной частью "ОборудованиеИКомплектующие" разработанного в конфигурации КА2. . . .
Functional First Web Framework Suave DevAlt 30.03.2026 Sauve. IO Апнулись до NET10. Из зависимостей один пакет, работает одинаково хорошо как в режиме проекта так и в интерактивном режиме. из сложностей - чисто функциональный подход. Решил. . .	Автоматическое создание документа при проведении другого документа Maks 29.03.2026 Реализация из решения ниже выполнена на нетиповых документах, разработанных в конфигурации КА2. Есть нетиповой документ "ЗаявкаНаРемонтСпецтехники" и нетиповой документ "ПланированиеСпецтехники". В. . .	Настройка движения справочника по регистру сведений Maks 29.03.2026 Решение ниже реализовано на примере нетипового справочника "ТарифыМобильнойСвязи" разработанного в конфигурации КА2, с целью учета корпоративной мобильной связи в коммерческом предприятии. . . .	Автозаполнение реквизита при выборе элемента справочника Maks 27.03.2026 Программный код из решения ниже на примере нетипового документа "ЗаявкаНаРемонтСпецтехники" разработанного в конфигурации КА2. При выборе "Спецтехники" (Тип Справочник. Спецтехника), заполняется. . .

@mrtoxas 3827 / 2677 / 1521 Регистрация: 12.07.2015 Сообщений: 6,672 Записей в блоге: 4
	22.09.2016, 09:32
	Это как? При нажатии на одну кнопку, умножается значение двух текстовых полей и value всех кнопок на странице? 0

@Дмитрий Дмитрий 1 / 1 / 2 Регистрация: 17.09.2016 Сообщений: 450
	22.09.2016, 09:52 [ТС]
	Неее))) Сейчас мы умножаем определенную кнопку при нажатии на эту окнопку, но надо умножить значение второй кнопки при нажатии на нее. Может так var button = 'button1'; wb_result.innerHTML = (editbox1editbox2buttonValue*button).t oFixed(2); Чтобы умножалось значение каждой кнопки при ее нажатии. Оставляя buttonValue. 0

@Дмитрий Дмитрий 1 / 1 / 2 Регистрация: 17.09.2016 Сообщений: 450
	22.09.2016, 14:35 [ТС]
	Блин, как объяснить то))) Вы мне дали этот же код, что и был, он добавляет только значение одной кнопки при её нажатии buttonValue, мне нужно добавлять в формулу несколько значений, нескольких кнопок, что то типо этого wb_result.innerHTML = (editbox1editbox2buttonValue1buttonVa lue2...buttonValuen).toFixed(2); 0

@mrtoxas 3827 / 2677 / 1521 Регистрация: 12.07.2015 Сообщений: 6,672 Записей в блоге: 4
	22.09.2016, 16:04
	1. Вы нажимаете на первую кнопку, в переменную X заносится множество значенией двух полей и самой кнопки. 2. Вы нажимаете на вторую кнопку, переменная Х умножается на значение второй кнопки. То же самое происходит и со следующими кнопками. Что должно происходить, если нажата сразу вторая кнопка? Умножать значения полей, нажатой кнопки и переходить к пункту 2? Правильно? 0

@Дмитрий Дмитрий 1 / 1 / 2 Регистрация: 17.09.2016 Сообщений: 450
	22.09.2016, 16:14 [ТС]
	Если сразу нажата вторая то умножаем на значение второй кнопки, очередь не имеет значения, какая нажата первая или восьмая: поле1* поле2* кнопкуА...кнопку n= результат, максимум используются две кнопки т.е. поле1 поле2кнопкаАкнопкаВ= результат. Если не понятно скину рисунок))) 0

@mrtoxas 3827 / 2677 / 1521 Регистрация: 12.07.2015 Сообщений: 6,672 Записей в блоге: 4
	22.09.2016, 16:32
	Скидываете. А если какая-то из кнопок нажата два раза? 0