Question

它不返回上一个答案，而是在答案中返回NAN

 <html>
    <head>
    
    <script type="text/javascript">
    function pro(n,p)
    {
    var number=parseInt(n); 
    var powe=parseInt(p); 
    for(var i=1;i<powe;i++)
    {
     number*=number;
    }
    document.getElementById("answer").value=number;
    } 
    </script>
    </head>

<body> 
<form name="F" > 
Enter Number <input type="text" name="num" id="num"/> 
Enter Power <select name="powe" id="powe"> 
  <option value="2" >square</option> 
  <option value="3" >cube</option> 
</select> 
Answer<input type="text" name="Answer" id="answer" /> 
<input type="button" onClick="pro(num,powe)" value="Calculate" />
</form>
</body>
</html>

Answer 1

传递给pro（）的

n和p是html元素，这就是为什么如果将其转换为数字它们就是NaN的原因。

要从输入元素获取值，可以使用.value

<html>

<head>

  <script type="text/javascript">
    function pro(n, p) {
      var number = parseInt(n.value);
      var powe = parseInt(p.value);
      for (var i = 1; i < powe; i++) {
        number *= number;
      }
      document.getElementById("answer").value = number;
    }
  </script>
</head>

<body>
  <form name="F">
    Enter Number <input type="text" name="num" id="num" /> Enter Power
    <select name="powe" id="powe">
      <option value="2">square</option>
      <option value="3">cube</option>
    </select>
    Answer<input type="text" name="Answer" id="answer" />
    <input type="button" onClick="pro(num,powe)" value="Calculate" />
  </form>
</body>

</html>

Answer 2

问题是这样的：onClick="pro(num,powe)"。而不是从输入元素中获取num和powe的值并传递到pro函数中，而是传递实际的元素引用（不是数字）。

要解决此问题，您需要获取元素的value。但是，在您快速编辑代码之前，请首先使用don't use inline HTML event attributes（onclick）。而是将JavaScript与HTML分离，并使用带有.addEventListener()的现代标准来设置事件处理程序，如下所示。

也（FYI）：

由于您实际上并未在任何地方提交表单数据，因此您不会需要一个<form>元素。
没有必要将parseInt与p.value一起使用，因为价值来自您的select，并且您已经将其设置为整数。
Don't bother with self-terminating tags（<input />）和您一样使用它们一无所获。
如果只希望输入数字，最好使用input type=number，它将用户输入限制为数字。进行此更改也使您不必担心parseInt会将输入数字误解为10以外的其他基数。
由于您不希望用户更改更改结果操作，最好将其显示在不可编辑的元素中，例如 span。
将<script>元素移到关闭body标签，因为解析器到达该标签时此时，您所有的HTML元素都会被解析到内存中。

<html>
  <head>
  </head>
  <body> 
     <div>    
       Enter Number <input type="number" name="num" id="num"> 
     </div>
     <div>
       Enter Power 
       <select name="powe" id="powe"> 
         <option value="2">square</option> 
         <option value="3">cube</option> 
       </select> 
     </div>
     <div>
       Answer <span id="answer"></span>
     </div>
     <div>
       <input type="button" value="Calculate">
     </div>
  <script>
  
    // Get references to the inputs, the answer container and the button
    let inputNum = document.getElementById("num");
    let power = document.getElementById("powe");
    let answer = document.getElementById("answer");
    let btn = document.querySelector("input[type='button']");
    
    // Set up the click event handler for the button
    btn.addEventListener("click", function(){
      // Now you need to get the input values and pass them 
      // to the function that will act with them
      pro(inputNum.value, power.value);
    });
    
    function pro(n,p) {
      var number = parseInt(n); 
      for(var i = 1; i < p; i++) {
        number *= number;
      }
      answer.textContent = number;
    } 
 </script>
</body>
</html>

Answer 3

尝试

document.getElementById("answer").innerHTML = number

无法在答案中获得答案返回答案

3 个答案: