Двойное условие и чекбокс
Столкнулся с такой проблемой. Нужно так, чтобы при включенном 1-м чекбоксе введенное число умножалось, допустим, на 2. При 2м чекбоксе на 3, а если включены оба сразу, то на 4. Если оба выключены, то число оставалось без изменений.
<html> <head> <script> function show_alert() { if (G1.checked) { www.value=qqq.value*2; } else if (G2.checked) { www.value=qqq.value*3; } else if (G1.checked && G2.checked) { www.value=qqq.value*4; } else { www.value=qqq.value; } } </script> </head><body> <input id="qqq"> <input type="checkbox" id="G1"> <input type="checkbox" id="G2"> <input type="button" value="Go! " onclick="show_alert()"> <br> <input id="www"> </body> </html> Все, вроде, работает, но когда я активирую оба чекбокса, то введенное число умножается на 2, а не на 4. |
ну наверное надо начинать проверку обратным образом: сначала оба чекбокса, потом по одному и на остаток если ничего не выбрано :)
|
учитывайте все варианты. Т.е
if (G1.checked && !G2.checked) { [url]www.value=qqq.value*2;[/url] } else if (!G1.checked && G2.checked) { [url]www.value=qqq.value*3;[/url] } Либо как сказал EmperioAf |
Помогло) Не знал, что от порядка что-то зависит.. Никто в обучалках даже не упомянул про это :-?
|
Ermite, а подумайте логически под какое условие попадает g1 && g2
function f(a,b) { if (a) { alert('a: true'); } else if (b) { alert('b: true'); } else if(a && b) { alert('a: true, b: true'); } else { alert('something else'); } } f(true, false); // a true f(false, true); // b true f(true, true); // a true f(false, false); // something else |
:)
<!DOCTYPE HTML> <html> <head> <script> function show_alert() { www.value=qqq.value*[[1,3],[2,4]][+G1.checked][+G2.checked]; } </script> </head><body> <input id="qqq"> <input type="checkbox" id="G1"> <input type="checkbox" id="G2"> <input type="button" value="Go! " onclick="show_alert()"> <br> <input id="www"> </body> </html> |
Цитата:
|
Ermite,
вариант для любого количества checkbox <!DOCTYPE HTML> <html> <head> <script> function show_alert() { var www = document.querySelector('#www'), qqq = document.querySelector('#qqq'), check = document.querySelectorAll('[type="checkbox"]'), result = [].reduceRight.call(check,function(num, current) { return num + +current.checked; }, ''); result = parseInt(result, 2); result++; www.value=qqq.value * result } </script> </head><body> <input id="qqq"> <input type="checkbox" >1 <input type="checkbox" >2 <input type="checkbox" >4 <input type="checkbox" >8 +=1 <input type="button" value="Go! " onclick="show_alert()"> <br> <input id="www"> </body> </html> |
рони,
Спасибо) Можно ли как-нибудь присвоить свои значения всем чекбоксам? Я вот сделал по-своему) <!DOCTYPE HTML> <html> <head> <script> function show_alert() { if (G1.checked) { g11=300; } else { g11=0; } if (G2.checked) { g22=500; } else { g22=0; } if (G3.checked) { g33=1000; } else { g33=0; } if (G4.checked) { g44=1500; } else { g44=0; } www.value=qqq.value*1 + g11*1 + g22*1 + g33*1 + g44*1; } </script> </head><body> <input id="qqq"> <input type="checkbox" id="G1">1 <input type="checkbox" id="G2">2 <input type="checkbox" id="G3">4 <input type="checkbox" id="G4">5 <input type="button" value="Go! " onclick="show_alert()"> <br> <input id="www"> </body> </html> Как всегда громоздко и примитивно, но зато работает) Только беда в том, что чекбоксов у меня будет около 20 и код получится слишком уж большим для относительно маленькой функции) |
Цитата:
4 чекбокса - 16 вариантов -- напишите их все по порядку в arr = [] или arr = {} и выбирайте arr[result] |
Часовой пояс GMT +3, время: 18:31. |