Question

我正在尝试创建一个包含两个框的表格，您可以在其中键入三角形的高度和底部，然后您可以在底部获得结果区域，这是我到目前为止的其他形状。但我无法弄清楚三角形。我很新，很抱歉。

    <h3>Calculo de Areas</h3>
        <p>Ingrese la Informacion requerida para sacar el Area de las siguientes Figuras.</p>
        <p>Nota:Los Resultados estan dados en la misma unidad que se introduce.</p>
            <table>
        <tr>
            <th>
<p>
  <label>Radio de un Circulo</label>
  <input id="inputradio" type="number" placeholder="Radio" oninput="LengthConverter9(this.value)" onchange="LengthConverter9(this.value)">
</p>
<p>Area: <span id="outputArea"></span></p>

<script>    
function LengthConverter9(valNum9) {
  document.getElementById("outputArea").innerHTML=(valNum9*valNum9)*3.14159265359;
}
                </script>
            </th><th>
<p>
  <label>Lado de un Cuadrado</label>
  <input id="inputLado" type="number" placeholder="Largo" oninput="LengthConverter10(this.value)" onchange="LengthConverter10(this.value)">
</p>
<p>Area: <span id="outputArea1"></span></p>

<script>
function LengthConverter10(valNum10) {
  document.getElementById("outputArea1").innerHTML=(valNum10*valNum10);
}
</script>

    <tr><th>
        <p>
  <label>Base de un Triangulo Rectangulo</label>
  <input id="inputBase" type="number" placeholder="Ancho" oninput="LengthConverter11(this.value)" onchange="LengthConverter11(this.value)">
</p>
        <p>
  <label>Altura de dicho Triangulo</label>
  <input id="inputAltura" type="number" placeholder="Alto" oninput="LengthConverter12(this.value)" onchange="LengthConverter12(this.value)">
</p>
<p>Area: <span id="outputArea4"></span></p>
<script>    
function LengthConverter11(valNum11){
  document.getElementById("outputMetros4").innerHTML=(LengthConverter11*LengthConverter12)/2;
}
                </script>


        </th></tr>
    </table>

我唯一不能上班的是三角形，提前谢谢。

Answer 1

在函数LengthConverter11（）中，您调用的是LengthConverter11和LengthConverter12，它们是函数，而不是变量。您需要做的是检索两个值的函数，然后执行操作。例如：

<input id="inputBase" type="number" placeholder="Ancho" name="triangleBase">
<input id="inputAltura" type="number" placeholder="Largo" name="triangleAltura" onchange="areaCalculator(this.value)">
<script>
  function areaCalculator(){
    var base = document.getElementById('inputBase').value;
    var altura = document.getElementById('inputAltura').value ; 
    document.getElementById("outputMetros4").innerHTML= (base*altura)/2;
  }
<script>

类似的东西，我还没有对它进行过测试，我不知道它是否准确，但基本上是你需要做的。

Answer 2

看着这个

  <input id="inputAltura" type="number" placeholder="Alto" oninput="LengthConverter12(this.value)" onchange="LengthConverter12(this.value)">

您尚未为LengthConverter12

定义任何功能

看这个（三角形的计算区域）

document.getElementById("outputMetros4").innerHTML=(LengthConverter11*LengthConverter12)/2;

你是一个由未定义函数定义的函数吗？

我建议你将所有的js代码放在一个部分，这样就可以很容易地调试和阅读。但是，使用您的布局并以您拥有的为基础，下面是一个片段

＆＃13;

<h3>Calculo de Areas</h3>
<p>Ingrese la Informacion requerida para sacar el Area de las siguientes Figuras.</p>
<p>Nota:Los Resultados estan dados en la misma unidad que se introduce.</p>
<table>
  <tr>
    <th>
      <p>
        <label>Radio de un Circulo</label>
        <input id="inputradio" type="number" placeholder="Radio" oninput="LengthConverter9(this.value)" onchange="LengthConverter9(this.value)">
      </p>
      <p>Area: <span id="outputArea"></span></p>

      <script>
        function LengthConverter9(valNum9) {
          document.getElementById("outputArea").innerHTML = (valNum9 * valNum9) * 3.14159265359;
        }
      </script>
    </th>
    <th>
      <p>
        <label>Lado de un Cuadrado</label>
        <input id="inputLado" type="number" placeholder="Largo" oninput="LengthConverter10(this.value)" onchange="LengthConverter10(this.value)">
      </p>
      <p>Area: <span id="outputArea1"></span></p>

      <script>
        function LengthConverter10(valNum10) {
          document.getElementById("outputArea1").innerHTML = (valNum10 * valNum10);
        }
      </script>

      <tr>
        <th>
          <p>
            <label>Base de un Triangulo Rectangulo</label>
            <input id="inputBase" type="number" placeholder="Ancho">
          </p>
          <p>
            <label>Altura de dicho Triangulo</label>
            <input id="inputAltura" type="number" placeholder="Alto" oninput="LengthConverter11(this.value)" onchange="LengthConverter11(this.value)">
          </p>
          <p>Area: <span id="outputArea4"></span></p>
          <script>
            function LengthConverter11(height) {
              var base = document.getElementById("inputBase").value.trim();
              console.log(base, height);
              height = height.trim();

              document.getElementById("outputArea4").innerHTML = (base * height) / 2;
            }
          </script>


        </th>
      </tr>
</table>

＆＃13;

如何用HTML计算三角形的面积

2 个答案: