从用户输入侧计算三角形区域和周长 [英] Calculate triangle area and circumference from user input sides
问题描述
我正在编写一个程序，根据用户的输入计算三角形的面积和周长。 （他们应该输入双方）。
这就是我拥有的一切，并且由于某种原因（我无法理解，无法查找），它是不工作。
< html>
< head>
< title> Triangle's Area&周长< /标题>
< meta charset =UTF-8>
< meta name =viewportcontent =width = device-width，initial-scale = 1.0>
< script type =text / javascript>
函数三角形（side1，side2，side3）{
this.side1 = side1;
this.side2 = side2;
this.side3 = side3;
this.getArea = function（）{
return s =（this.side1 + this.side2 + this.side3）/ 2;
area = squareRoot（s *（s-side1）*（s-side2）*（s-side3））;
};
this.getPerimeter = function（）{
return side1 + side2 + side3;
};
this.toString = function（）{
return带有边的三角形=+ this.side1 + this.side2 + this.side3 +has Area =+ this.getArea （）+和Perimeter =+ this.getPerimeter（）;
};
函数calculate（）{
var s = parseFloat（document.getElementById（'side1'，'side2'，'side3'）。value） ;
if（isNaN（s））{
document.getElementById（'data'）。innerHTML =请只输入数字;
return;
$ b $ if（s <= 0）{
document.getElementById（'data'）。innerHTML =负数和零无意义;
return;
}
var myTriangle = new Triangle（）;
document.getElementById（'data'）。innerHTML = myTriangle.toString（）;
}
< / script>
< / head>
< body>
< h3>程序计算三角形的面积和周长< / h3>
< p>输入side1：< input type =textid =side1value =/>
< p>输入side2：< input type =textid =side2value =/>
< p>输入side3：< input type =textid =side3value =/>
< input type =buttonvalue =CalculateonClick =calculate（）/>< / p>
< p id =data>< / p>
< / body>
这里有一些小错误，所以让我们开始吧。首先，让我们来看看输入：
var s = parseFloat（document.getElementById（'side1'，'side2' 。， 'SIDE3'）值）;
我们需要知道所有计算中的三个不同方面，所以让我们分别检索输入： / p>
var s1 = parseFloat（document.getElementById（'side1'）
，s2 = parseFloat（document.getElementById（' （'side2'）
，s3 = parseFloat（document.getElementById（'side3'）;
接下来，我们将需要对所有三个数字运行验证，将以下条件更改为：
if（isNaN（s1）| | isNaN（s2）|| isNaN（s3））
... ...和...
if（s1 <= 0 || s2 <= 0 || s3 <= 0）构造函数：
Triangle
> p>
var myTriangle = new Triangle（s1，s2，s3）;
接下来，让我们来看看
Triangle对象。getPerimeter（）功能运行良好，因此不需要触摸它。要从三角形的边缘看到我们可以使用 Heron的公式， 。这是一个使用我们已经定义的getPerimeter（）函数的工作实现：
this.getArea = function（）{
var p = this.getPerimeter（）;
return Math.sqrt（p *（p-side1）*（p-side2）*（p-side3））;
};
这是一个可以工作的 JSFiddle 的所有修复。请注意，我还做了其他一些清理工作，例如缓存DOM节点。 （您需要将JavaScript代码放在
< body>结尾处的< script>标签内>它的工作原理。）I am trying to write a program that calculates the area and the circumference of a triangle from the user's input. (They're supposed to input the sides).
This is all I have and for some reason (which I can't understand well enough to look up), it's not working.
<html> <head> <title>Triangle's Area & Perimeter</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script type="text/javascript"> function Triangle(side1,side2,side3){ this.side1 = side1; this.side2 = side2; this.side3 = side3; this.getArea = function(){ return s = (this.side1 + this.side2 + this.side3)/2; area = squareRoot(s * (s-side1) * (s-side2) * (s-side3)); }; this.getPerimeter = function(){ return side1 + side2 + side3; }; this.toString = function(){ return "The Triangle with sides = " + this.side1 + this.side2 + this.side3 + " has Area = " + this.getArea() + " and Perimeter = " + this.getPerimeter(); }; } function calculate(){ var s = parseFloat(document.getElementById('side1','side2','side3').value); if(isNaN(s)){ document.getElementById('data').innerHTML = "Please enter numbers only"; return; } if(s<=0){ document.getElementById('data').innerHTML = "Negative numbers and Zero don't make sense"; return; } var myTriangle = new Triangle(); document.getElementById('data').innerHTML = myTriangle.toString(); } </script> </head> <body> <h3>Program Calculates Area and Perimeter of Triangles</h3> <p>Enter the side1: <input type="text" id="side1" value="" /> <p>Enter the side2: <input type="text" id="side2" value="" /> <p>Enter the side3: <input type="text" id="side3" value="" /> <input type="button" value="Calculate" onClick="calculate()" /></p> <p id="data"></p> </body>解决方案There are a couple of minor mistakes here, so let's start. First, let's have a look at the input:
var s = parseFloat(document.getElementById('side1','side2','side3').value);We need to know the three different sides in all our calculations, so let's retrieve the inputs separately:
var s1 = parseFloat(document.getElementById('side1') , s2 = parseFloat(document.getElementById('side2') , s3 = parseFloat(document.getElementById('side3');Next we will need to run your validations on all three numbers, changing the following conditionals to:
if(isNaN(s1) || isNaN(s2) || isNaN(s3))... and ...
if(s1<=0 || s2<=0 || s3<=0)Finally we'll need to pass all the values to our
Triangleconstructor:var myTriangle = new Triangle(s1, s2, s3);
Next, let's have a look at our
Triangleobject. ThegetPerimeter()function works well, so no need to touch that. To get the area of a triangle from its sides we can use Heron's formula, which you've attempted. Here's a working implementation using our already definedgetPerimeter()function:this.getArea = function(){ var p = this.getPerimeter(); return Math.sqrt(p * (p-side1) * (p-side2) * (p-side3)); };
Here is a working JSFiddle with all the fixes. Note that I did some other clean-ups as well, like cache the DOM nodes. (You'll need to put the JavaScript code within
<script>tags at the end of your<body>element for it to work.)这篇关于从用户输入侧计算三角形区域和周长的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
