Получение значений из нескольких checkbox

@Despot777 · Регистрация: 14.09.2013

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

Подскажите как получить значение из нескольких checkbox?

HTML5
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
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
<!DOCTYPE html>
 
<html>
 
    <head>
        
    <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8">
 
    <title> Конвертатор килограм в фунты </title>
 
 
    <script>
 
        var myInput;
        window.onload = function(){
            myInput = document.getElementsByName("aa");
            for(var i=0; i<myInput.length; i++) myInput[i].addEventListener("change",t);
        }
        function t(){
            var z = (this.value*1000)/409;
            document.getElementsByTagName("output")[0].innerHTML = z.toFixed(2)+" фунтов";
        }
 
    </script>
 
    </head>
 
        <body>
 
        <h1 align="center"> Давайте узнаем сколько фунтов в килограмах! </h1>
 
        <hr>
 
        <table border="1" align="center">
 
        <tr>
            <td align="center">
                <input type="checkbox" name="aa"  value="100">100<BR>
                <input type="checkbox" name="aa"  value="200">200<BR>
                <input type="checkbox" name="aa"  value="300">300<BR>
                <input type="checkbox" name="aa"  value="400">400<BR>
                <input type="checkbox" name="aa"  value="500">500<BR>
                <input type="checkbox" name="aa"  value="600">600<BR>
                <input type="checkbox" name="aa"  value="700">700<BR>
                <input type="checkbox" name="aa"  value="800">800<BR>
                <input type="checkbox" name="aa"  value="900">900<BR>
                <input type="checkbox" name="aa"  value="1000">1000<BR><BR>
            </td>
        </tr>
 
 
        </table>
        </form>
        
        </body>
 
</html>

@arcmag · 22.03.2015, 19:49

Вы про циклы знаете, циклы массивы?
То есть можно получить массив всех элементов checkbox и в цикле вытащить значение из каждого элемента массива.

JavaScript
1
2
3
4
5
6
7
8
9
var checkbox;
window.onload = function(){
checkbox = document.getElementsByName("aa"); // получаем массив чекбоксов
var str = "";
for(var i=0; i<checkbox.length; i++){// пробегаем весь массив
    str+=checkbox[i].value+" ";// записываем каждое значение в строку и разделяем пробелом
}
document.write(str); // выводим получившуюся строку
}

@Despot777 · 22.03.2015, 22:07 **[ТС]**

Спасибо за ответ, но у меня получилось сделать самому.
Вот код который у меня получился для общего подсчета checkbox

HTML5
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
<form name="Sum">
  <input type="checkbox" name="aa" value="100">100<BR>
        <input type="checkbox" name="aa" value="200">200<BR>
        <input type="checkbox" name="aa" value="300">300<BR>
        <input type="checkbox" name="aa" value="400">400<BR>
        <input type="checkbox" name="aa" value="500">500<BR>
        <input type="checkbox" name="aa" value="600">600<BR>
        <input type="checkbox" name="aa" value="700">700<BR>
        <input type="checkbox" name="aa" value="800">800<BR>
        <input type="checkbox" name="aa" value="900">900<BR>
        <input type="checkbox" name="aa" value="1000">1000<BR><BR>
  <output id="rezultat">Сумма: 0</output>
</form>
 
<script>
var s = document.forms.Sum,
    d = s.querySelectorAll('input[type="checkbox"]:not([value]), input[type="checkbox"][value=""]');
  for (var l = 0; l < d.length; l++) // чтобы не было написано NaN, убираем в disabled пункты, где не прописаны значения
    d[l].disabled = true;
s.onchange = function() { // начало работы функции сложения
  var n = s.querySelectorAll('[type="checkbox"]'),
      itog = 0;
  for(var j=0; j<n.length; j++)
    n[j].checked ? itog += parseFloat(n[j].value) : itog;
  var z1 = (itog*1000)/409;
    document.getElementById('rezultat').innerHTML = 'Сумма: ' + z1;
}
</script>

Новые блоги и статьи Все статьи Все блоги /
Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT bedvit 28.01.2026 Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .	Загрузка PNG с альфа-каналом на SDL3 для Android: с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 28.01.2026 Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .	Загрузка PNG с альфа-каналом на SDL3 для Android: с помощью SDL3_image 8Observer8 27.01.2026 Содержание блога SDL3_image - это библиотека для загрузки и работы с изображениями. Эта пошаговая инструкция покажет, как загрузить и вывести на экран смартфона картинку с альфа-каналом, то есть с. . .	влияние грибов на сукцессию anaschu 26.01.2026 Бифуркационные изменения массы гриба происходят тогда, когда мы уменьшаем массу компоста в 10 раз, а скорость прироста биомассы уменьшаем в три раза. Скорость прироста биомассы может уменьшаться за. . .
Воспроизведение звукового файла с помощью SDL3_mixer при касании экрана Android 8Observer8 26.01.2026 Содержание блога SDL3_mixer - это библиотека я для воспроизведения аудио. В отличие от инструкции по добавлению текста код по проигрыванию звука уже содержится в шаблоне примера. Нужно только. . .	Установка Android SDK, NDK, JDK, CMake и т.д. 8Observer8 25.01.2026 Содержание блога Перейдите по ссылке: https:/ / developer. android. com/ studio и в самом низу страницы кликните по архиву "commandlinetools-win-xxxxxx_latest. zip" Извлеките архив и вы увидите. . .	Вывод текста со шрифтом TTF на Android с помощью библиотеки SDL3_ttf 8Observer8 25.01.2026 Содержание блога Если у вас не установлены Android SDK, NDK, JDK, и т. д. то сделайте это по следующей инструкции: Установка Android SDK, NDK, JDK, CMake и т. д. Сборка примера Скачайте. . .	Использование SDL3-callbacks вместо функции main() на Android, Desktop и WebAssembly 8Observer8 24.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .

Получение значений из нескольких checkbox

Решение