Question

我构建了此函数，如果您使用document.write输出函数结果，则该函数可以正常工作。但是，如果您使用document.getElementById，则输出在'r'div中短暂显示，然后又消失，有人知道我在做什么错吗？

<!DOCTYPE html>

<html>
<head>
    <title>TODO supply a title</title>
    <meta charset="windows-1252">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script>
        function CalculateCost(){
            var height=document.getElementById('myform').height.value;
            var width=document.getElementById('myform').width.value;
          var result = width*height;

    document.getElementById("r").innerHTML = "The cost of your carpet will 
  be" + result;

        }
        </script>


  </head>
   <body>
    <div><p >This function will calculate the cost of your carpet. Just enter 
the width and length
of your room and the function will calculate the cost of your carpet and 
return the information to you back this
in this page</p>
        <form id='myform'onsubmit='CalculateCost()'>
Enter a width between 1 and 100.
 <input type="number" name="height" min="1" max="100" >
 Enter a height between 1 and 100.
<input type="number" name="width" min="1" max="100" >
<input type="submit">
</form>
    </div>
    <p id="r"></p>
</body>
</html>

函数输出innerHTML出现和消失。

0 个答案: