У меня работает вычисление периметра и площади квадрата и прямоугольника но когда я пытался сделать что-то подобное с треугольником у меня не выполнялось вычисление ,а строчки просто складывались как строчки.Помогите пожалуйста, вот код:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>Главная</title>
<link rel="stylesheet" href="style.css"/>
<script src="script.js"></script>
</head>
<body>
<form action="" method="post" id="myform">
<div id="re">
<h3>Вычисление площади и периметра прямоугольника и квадрата</h3>
<div>Введите первую сторону:</div>
<input type="text" id="S_P_re_first" maxlength="11">
<br /><br />
<div>Введите вторую сторону:</div>
<input type="text" id="S_P_re_second" maxlength="11">
<br /><br />
<input type="button" id="button_re" onclick="result_re()" value="Вычислить">
<input type="button" id="button_re_reset" onclick="reset_re()" value="Обновить все">
<p id="result_p_re">Периметр:</p>
<p id="result_s_re">Площадь:</p>
</div>
<div id="tr">
<h3>Вычисление площади и периметра треугольника</h3>
<div>Введите первую сторону:</div>
<input type="text" id="S_P_tr_first" maxlength="11">
<br /><br />
<div>Введите вторую сторону:</div>
<input type="text" id="S_P_tr_second" maxlength="11">
<br /><br />
<div>Введите третью сторону:</div>
<input type="text" id="S_P_tr_third" maxlength="11">
<br /><br />
<input type="button" id="button_tr" onclick="result_tr()" value="Вычислить">
<input type="button" id="button_re_reset" value="Обновить все">
<p id="result_p_tr">Периметр:</p>
<p id="result_s_tr">Площадь:</p>
</div>
</form>
</body>
</html>
//Площадь и периметр квадрата и прямоугольника
function result_re(a,b){
a = document.getElementById('S_P_re_first').value;
b = document.getElementById('S_P_re_second').value;
res_p = a * 2 + b * 2;
res_s = a * b;
if (a == "" || b == ""){
alert("Вы не ввели значение!");
}else {
document.getElementById('result_p_re').innerHTML = "Периметр: "+res_p+" СМ";
document.getElementById('result_s_re').innerHTML = "Площадь: "+res_s+" СМ<sup>2</sup>";
}
return res_p, res_s;
}
function reset_re(){
document.getElementById('S_P_re_first').value = "";
document.getElementById('S_P_re_second').value = "";
document.getElementById('result_p_re').innerHTML = "Периметр: ";
document.getElementById('result_s_re').innerHTML = "Площадь: ";
}
//Площадь и периметр треугольника
function result_tr(a,b,c){
a = document.getElementById("S_P_tr_first").value;
b = document.getElementById("S_P_tr_second").value;
c = document.getElementById("S_P_tr_third").value;
parseInt(a);
parseInt(b);
parseInt(c);
res_p = a + b + c;
res_s = (a * b) * 0.5;
if(a == "" || b == ""){
alert('Вы не ввели значение!');
}else{
document.getElementById('result_p_tr').innerHTML = "Периметр: "+res_p+" СМ";
document.getElementById('result_s_tr').innerHTML = "Площадь: "+res_s+" СМ<sup>2</sup>";
}
}
CSS:
|
Код:
|
#result_p_re,#result_s_re{
position: relative;
left: 220px;
bottom: 125px;
width: 800px;
height: 20px;
border: 2px solid black;
padding: 2px 0px 2px 5px;
vertical-align: middle;
}
#result_s_tr,#result_p_tr{
position: relative;
left: 220px;
bottom: 155px;
width: 800px;
height: 20px;
border: 2px solid black;
padding: 2px 0px 2px 5px;
vertical-align: middle;
}
#tr{
position: relative;
bottom: 90px;
} |
