Kvark, может быть и стоит перейти на div. Версия пока рабочая, мне как-то с таблицей нагляднее что ли...
А тема была в том, чтобы в калькуляторе сделать и чекбоксы и радио, с этим мне уже помогли.
И у меня сразу новый вопрос. Я хочу сделать дополнительную опцию для расчета, чтобы помимо рублей, он считал еще и время в отдельной строке, как "итого". Но что-то у меня не получается.
Пробовала я так:
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<script type="text/javascript">
function calc() {
var type_exp1 =
document.getElementById("type_exp1");
var type_exp2 =
document.getElementById("type_exp2");
var type_exp3 =
document.getElementById("type_exp3");
var type_exp4 =
document.getElementsByName('type_exp4');
var price = 0;
for (var i = 0; i <
type_exp4.length; i++)
if (type_exp4[i].checked) {
price += +type_exp4
[i].value;
}
document.getElementById
("result_exp4").innerHTML = price;
//Result
var result =
document.getElementById("result");
var price_exp1 = 0;
var price_exp2 = 0;
var price_exp3 = 0;
price_exp1 += (type_exp1.checked
== true) ? parseInt(type_exp1.value) : 0;
price_exp2 += (type_exp2.checked
== true) ? parseInt(type_exp2.value) : 0;
price_exp3 += (type_exp3.checked
== true) ? parseInt(type_exp3.value) : 0;
price += price_exp1 + price_exp2
+ price_exp3;
result_exp1.innerHTML =
price_exp1;
result_exp2.innerHTML =
price_exp2;
result_exp3.innerHTML =
price_exp3;
result.innerHTML = price;
}
function time() {
if (type_exp1.checked){
var time_exp1=parseFloat(time_exp1.value);
}
else time_exp1=0;
if (type_exp2.checked){
var time_exp2=parseFloat(time_exp2.value);
}
else time_exp2=0;
if (type_exp3.checked){
var time_exp3=parseFloat(time_exp3.value);
}
else time_exp3=0;
var time = time_exp1 + time_exp2 + time_exp3;
document.getElementById("result_time").innerHTML=time;
}
</script>
<table width="600">
<tr>
<td colspan="3" width="500">
<input type="checkbox"
onchange="calc()" value="1500" id="type_exp1"
/>test1</td>
<td width="200"><span
id="result_exp1">0</span> руб.</td>
<td width="200"><span
id="time_exp1" value="10" name="time_exp1">10</span> мин.</td>
</tr>
<tr>
<td colspan="3" width="500">
<input type="checkbox"
onchange="calc()" value="1500" id="type_exp2"
/>test2</td>
<td width="200"><span
id="result_exp2">0</span> руб.</td>
<td width="200"><span
id="time_exp2" value="15" name="time_exp2">15</span> мин.</td>
</tr>
<tr>
<td colspan="3" width="500">
<input type="checkbox"
onchange="calc()" value="1500" id="type_exp3"
/>test3</td>
<td width="200"><span
id="result_exp3">0</span> руб.</td>
<td width="200"><span
id="time_exp3" value="20" name="time_exp3">20</span> мин.</td>
</tr>
<tr>
<td width="200">
<input type="radio"
onchange="calc()" value="1000" name="type_exp4"
/>test4</td>
<td width="200">
<input type="radio"
onchange="calc()" value="1500" name="type_exp4"
/>test4</td>
<td width="200">
<input type="radio"
onchange="calc()" value="2000" name="type_exp4"
/>test4</td>
<td width="200"><span
id="result_exp4">0</span> руб.</td>
</tr>
<!-- Итог -->
<tr>
<td colspan="3" width="500"
class="td_result_time">ВРЕМЯ:</td>
<td class="td_time"><span
id="result_time">0</span> мин.</td>
</tr>
<tr>
<td colspan="3" width="500"
class="td_result">ИТОГО:</td>
<td class="td_result"><span
id="result">0</span> руб.</td>
</tr>
</table>
</body>
</html>