Question

我创建了一个程序，该函数从文本框中获取值并通过Nilakantha方法计算pi。这是代码 HTML：

<p><input type="text" class="textbox" placeholder="Enter the number of times you want to calculate" id="maximum" onchange="getValue()"></p>
<p><button class="button" onclick="calculation(n)">Click to see the caculation procedure</button></p>
<p><ul id="resultlist"></ul></p>

使用Javascript：

function getValue(){
    var n = Number(document.getElementById("maximum").value);
    if (isNaN(n)){
        alert("Sorry you should input a number");}
    else {return n;}
}
var pi = 3;
function calculation(n){
    for (var k=1;k<n; k++){
        pi = pi + (Math.pow((-1),(k+1))*4)/(2*k*(2*k+1)*(2*k+2));
        document.getElementById('resultlist').innerHTML = '<li>' + pi + '</li>';
}}

但它根本不起作用，文本框中的值应该是程序计算的最大次数。它应该打印一个列表来显示计算过程。

Answer 1

您必须将号码传递到calculation(n) <button class="button" onclick="calculation(n)">，因为浏览器不知道n是什么，所以它可能是undifned值，而您的for循环不会工作。

解决方案：将该行更改为

<button class="button" onclick="calculation(getValue())">

现在，在传递价值之前，浏览器会首先致电getValue以获取#maximum输入的数字，然后将其传递给您的calculation。

编辑：

如果您想显示所有进度，则无法直接将值分配给

document.getElementById（＆＃39; resultlist＆＃39;）。innerHTML将覆盖它，你必须将结果附加到临时存储器并在循环结束时将其设置为html。

＆＃13;

function getValue(){
    var n = Number(document.getElementById("maximum").value);
    if (isNaN(n)){
        alert("Sorry you should input a number");}
    else {return n;}
}
var pi = 3;
function calculation(n){
    // If you want to keep previouse result then use the commented out ones.
    // var text = "<hr><br/>";
    var text = "";
    for (var k=1;k<n; k++){
        pi = pi + (Math.pow((-1),(k+1))*4)/(2*k*(2*k+1)*(2*k+2));
        text += '<li>' + pi + '</li>';   
    }
    document.getElementById('resultlist').innerHTML = text;
    //document.getElementById('resultlist').innerHTML = text + document.getElementById('resultlist').innerHTML;
}

＆＃13;

<p><input type="text" class="textbox" placeholder="Enter the number of times you want to calculate" id="maximum" onchange="getValue()"></p>
<p><button class="button" onclick="calculation(getValue())">Click to see the caculation procedure</button></p>
<p><ul id="resultlist"></ul></p>

＆＃13;

Answer 2

计算方法接受一个名为n的参数，但它将抛出undefined。只需改变一些事情

 <p><input type="text" class="textbox" placeholder="Enter the number of times you want to calculate" id="maximum" ></p>
 <p><button class="button" onclick="calculation()">Click to see the caculation procedure</button></p>
 <p><ul id="resultlist"></ul></p>

在javascript中

function getValue(){
   var n = Number(document.getElementById("maximum").value);
   if (isNaN(n)){
    alert("Sorry you should input a number");}
   else {return n;}
}

var pi = 3;
function calculation(){
  var n = getValue();
  for (var k=1;k<n; k++){
    pi = pi + (Math.pow((-1),(k+1))*4)/(2*k*(2*k+1)*(2*k+2));
    document.getElementById('resultlist').innerHTML = '<li>' + pi + '</li>';
  }
}

如何返回获取值并在javascript中打印出列表

2 个答案: