Не работает событие onclick

@Айдар94 · Регистрация: 05.11.2013

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

Не работает событие onclick в radio. При нажатии на элементы radio не запускается функция, можете помочь?

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<form method="post" id="form_1" action="add_chart.php">
        <input type="hidden" name="name" value="СЕНЕЖ АКВАДЕКОР Х2"/>
        <div class="korzina_table_cell korzina_text_1">
            <input type="radio" id="c1" name="ves" value="0.9" checked=""/>&nbsp;&nbsp;<label for="c1"><span></span>0.9 кг</label><br/>
            <input type="radio" id="c2" name="ves" value="2.5" />&nbsp;&nbsp;<label for="c2"><span></span>2.5 кг</label><br/>
            <input type="radio" id="c3" name="ves" value="9" />&nbsp;&nbsp;<label for="c3"><span></span>9 кг</label><br/>
        </div>
        <div class="korzina_table_cell korzina_text_1" required="">
            <input id="proj" onChange="calcul()" type="number" name="pcs" min="1" style="width: 50px;" value="1"/>&nbsp;&nbsp;<label for="c1">шт.</label>
        </div>  
        <div class="korzina_table_cell korzina_text_1" required="">
            <span id="priceframe1" class="price-frame">33</span>
        </div>  
        <div class="clear "></div>
        <div class="vkorzinu">
          В КОРЗИНУ
        </div> 
        </form>

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
34
function getChar(event) {
    if (event.which == null) {
        if (event.keyCode < 32) return null;
        return String.fromCharCode(event.keyCode) // IE
    }
    if (event.which != 0 && event.charCode != 0) {
        if (event.which < 32) return null;
        return String.fromCharCode(event.which)
    }
    return null; 
}
/*1ый элемент*/
    var form1 = document.forms.form_1;
    var colElem1 = form1.elements.pcs;
    var vesElem1 = form1.elements.ves;
    colElem1.onkeypress = function(e) {
        e = e || event;
          var chr = getChar(e);
          if (e.ctrlKey || e.altKey || chr == null) return;
          if (chr < '0' || chr > '9') return false;
    }
    colElem1.onkeyup = calculate1;
    colElem1.oninput = calculate1;
    vesElem1.onclick = calculate1;
    colElem1.onpropertychange = function() { 
      event.propertyName == "value" && calculate1();
    }
function calculate1() {
    var sum = +colElem1.value;
    if (vesElem1.value == '0.9'){var price1='340';var summ=parseInt(sum)*price1;}
    if (vesElem1.value == '2.5'){var price1='857';var summ=parseInt(sum)*price1;}
    if (vesElem1.value == '9'){var price1='2816';var summ=parseInt(sum)*price1;}
    document.getElementById('priceframe1').innerHTML=summ;
}

Добавлено через 47 секунд
Проблема в 24 ой строке js

Добавлено через 10 минут
http://jsfiddle.net/3vvq6fgg/ пример

@g3nchik · 03.08.2015, 21:05

Ну потому что вы получаете массив

HTML5
1
<input type="radio" name="ves">

К каждому элементу нужно присвоить обработку события onClick, т.е. [0],[1],[2].

Вот, код теперь работает:

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
34
35
36
function getChar(event) {
    if (event.which == null) {
        if (event.keyCode < 32) return null;
        return String.fromCharCode(event.keyCode) // IE
    }
    if (event.which != 0 && event.charCode != 0) {
        if (event.which < 32) return null;
        return String.fromCharCode(event.which)
    }
    return null; 
}
/*1ый элемент*/
    var form1 = document.forms.form_1;
    var colElem1 = form1.elements.pcs;
    var vesElem1 = form1.elements.ves;
    colElem1.onkeypress = function(e) {
        e = e || event;
          var chr = getChar(e);
          if (e.ctrlKey || e.altKey || chr == null) return;
          if (chr < '0' || chr > '9') return false;
    }
    colElem1.onkeyup = calculate1;
    colElem1.oninput = calculate1;
    vesElem1[0].onclick = calculate1;
     vesElem1[1].onclick = calculate1;
     vesElem1[2].onclick = calculate1;
    colElem1.onpropertychange = function() { 
      event.propertyName == "value" && calculate1();
    }
function calculate1() {
    var sum = +colElem1.value;
    if (vesElem1.value == '0.9'){var price1='340';var summ=parseInt(sum)*price1;}
    if (vesElem1.value == '2.5'){var price1='857';var summ=parseInt(sum)*price1;}
    if (vesElem1.value == '9'){var price1='2816';var summ=parseInt(sum)*price1;}
    document.getElementById('priceframe1').innerHTML=summ;
}

@Айдар94 · 03.08.2015, 21:25 **[ТС]**

g3nchik, Спасибо большое. Не сможете совет дать, а как можно код минимизировать, если форм будет скажем 10?

@Thisman · 04.08.2015, 08:26

Айдар94, я бы на вашем месте использовал делегирование - вешаем обработчик на родителе, и там уже решаем какую функцию нужно выполнить

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
var form; // ссылка на нашу форму, их может быть даже несколько, тогда просто проходим по массиву циклом
 
var element1ClickHundler = function () {} // обработчик для одного типа элементов
var element2ClickHundler = function () {} // обработчик для другого типа элементов
 
// обработчик, который будет делегировать события для разных элементов
var formClickHundler = function (e) {
    var e = e || event;
    var trg = e.target || e.srcElement // определяем, на каком элементе сработало событие
 
    if(trg.getAttribute("name") == "name1") element1ClickHundler ();
    else if(trg.getAttribute("name") == "name2") element2ClickHundler ();
    /* и т.д. из за магического всплытия, даже нажав на радиокнопку, 
        сработает событие на форме, оно и решит, что нужно делать */
};
 
form.onclick = formClickHundler; // применяем

Новые блоги и статьи Все статьи Все блоги /
Использование SDL3-callbacks вместо функции main() на Android, Desktop и WebAssembly 8Observer8 24.01.2026 Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а привычная функция main(). . .	моя боль iceja 24.01.2026 Выложила интерполяцию кубическими сплайнами www. iceja. net REST сервисы временно не работают, только через Web. Написала за 56 рабочих часов этот сайт с нуля. При помощи perplexity. ai PRO , при. . .	Модель сукцессии микоризы anaschu 24.01.2026 Решили писать научную статью с неким РОманом	http://iceja.net/ математические сервисы iceja 20.01.2026 Обновила свой сайт http:/ / iceja. net/ , приделала Fast Fourier Transform экстраполяцию сигналов. Однако предсказывает далеко не каждый сигнал (см ограничения http:/ / iceja. net/ fourier/ docs ). Также. . .
http://iceja.net/ сервер решения полиномов iceja 18.01.2026 Выкатила http:/ / iceja. net/ сервер решения полиномов (находит действительные корни полиномов методом Штурма). На сайте документация по API, но скажу прямо VPS слабенький и 200 000 полиномов. . .	Расчёт переходных процессов в цепи постоянного тока igorrr37 16.01.2026 / * Дана цепь(не выше 3-го порядка) постоянного тока с элементами R, L, C, k(ключ), U, E, J. Программа находит переходные токи и напряжения на элементах схемы классическим методом(1 и 2 з-ны. . .	Восстановить юзерскрипты Greasemonkey из бэкапа браузера damix 15.01.2026 Если восстановить из бэкапа профиль Firefox после переустановки винды, то список юзерскриптов в Greasemonkey будет пустым. Но восстановить их можно так. Для этого понадобится консольная утилита. . .	Сукцессия микоризы: основная теория в виде двух уравнений. anaschu 11.01.2026 https:/ / rutube. ru/ video/ 7a537f578d808e67a3c6fd818a44a5c4/

@Айдар94 0 / 0 / 0 Регистрация: 05.11.2013 Сообщений: 112
	03.08.2015, 21:25 [ТС]
	g3nchik, Спасибо большое. Не сможете совет дать, а как можно код минимизировать, если форм будет скажем 10? 0

Опции темы