Question

美好的一天！非常感谢帮助！

function ShowDistance() {
  var x1 = parsefloat(document.getElementById('xOne').value);
  var x2 = parsefloat(document.getElementById('xTwo').value);
  var y1 = parsefloat(document.getElementById('yOne').value);
  var y2 = parsefloat(document.getElementById('yTwo').value);

  var distance = Math.sqrt(Math.pow((x1 - x2), 2) + Math.pow((y1 - y2), 2));
  return distance;

  if (!isNaN(result)) {
    document.getElementById('outPut').innerHTML = 'The distance bewtween (' + x1 + ',' + y1 + ') and (' + x2 + ',' + y2 + ') is ' + distance + ;
  }
}

<!doctype html>
<html>

<head>
  <title> Distance Calculator </title>

</head>

<body>
  <h2>Distance Calculator</h2>
  Coordinate 1 (<input type="text" id="xOne" size=12 value=''> ,
  <input type="text" id="yOne" size=12 value=''>)
  <br> Coordinate 2 (<input type="text" id="xTwo" size=12 value=''> ,
  <input type="text" id="yTwo" size=12 value=''>)
  <br>
  <br>
  <button onclick="ShowDistance()">Calculate</button>

</body>

</html>

无法打印结果。那是唯一的问题。我无法打印结果。请帮我。非常感谢您的答复

Answer 1

您的代码中有很多错误；

1-首先，不是parsefloat，应该是parseFloat;

2-第二个，您从ShowDistance返回而不显示结果；

3- if子句中的第三位应该是if(!isNaN(distance))，而不是if(!isNaN(result));

4-您确实忘记了在要打印结果的位置创建带有输出 id的Html标记。

所有代码；

<!doctype html>
<html>
<head>
<title> Distance Calculator </title>

</head>

<body>
    <h2>Distance Calculator</h2>
        Coordinate 1 (<input type="text" id="xOne" size=12 value=''> ,
        <input type="text" id="yOne" size=12 value=''>)
        <br>
        Coordinate 2 (<input type="text" id="xTwo" size=12 value=''> ,
        <input type="text" id="yTwo" size=12 value=''>)
        <br>
        <br>
        <button onclick="ShowDistance()">Calculate</button>
        <div id="outPut">

        </div>

    <script>
    function ShowDistance()
    {
        var x1=parseFloat(document.getElementById('xOne').value);
        var x2=parseFloat(document.getElementById('xTwo').value);
        var y1=parseFloat(document.getElementById('yOne').value);
        var y2=parseFloat(document.getElementById('yTwo').value);

        var distance =Math.sqrt( Math.pow((x1-x2), 2) + Math.pow((y1-y2), 2) );


        if (!isNaN(distance))
        {
            document.getElementById('outPut').innerHTML='The distance bewtween (' + x1 + ',' + y1 + ') and (' + x2 + ',' + y2 + ') is '+ distance;
        }

        return distance;
    }
    </script> 
</body>
</html>

Answer 2

return distance;

将导致任何后续代码都无法运行，因为return关键字将停止执行代码，因此：

if (!isNaN(distance))
{
    document.getElementById('outPut').innerHTML='The distance bewtween (' + x1 + ',' + y1 + ') and (' + x2 + ',' + y2 + ') is '+ distance;
}

永远不会运行。

将代码放在返回值上方，或删除返回值，因为不使用返回值。您应该会看到一个新结果。

距离计算器HTML

2 个答案: