Question

我有这段简单的代码：

＆＃13;

var numb1 = document.getElementById("numb1")
var numb2 = document.getElementById("numb2")
var numb3 = document.getElementById("numb3")
var numb4 = document.getElementById("numb4")
var v1 = parseInt(numb1)
var v2 = parseInt(numb2)
var v3 = parseInt(numb3)
var v4 = parseInt(numb4)
var t = parseInt(0)

function myFunction() {
  if (numb1.checked == true) {
    var t = v1 + t
  } else if (numb2.checked == true) {
    var t = v2 + t
  } else if (numb3.checked == true) {
    var t = v3 + t
  } else if (numb4.checked == true) {
    var t = v4 + t
  }
  document.getElementById("demo").innerHTML = t
}

＆＃13;

<input id="numb1" type="radio" value="10">
<input id="numb2" type="radio" value="50">
<input id="numb3" type="radio" value="80">
<input id="numb4" type="radio" value="120">

<button type="button" onclick="myFunction()">Submit</button>

<p id="demo"></p>

＆＃13;

我明白在制作变量时我肯定会更有效率，但我的问题是，即使我使用parseInt()从字符串变为整数，demo中的最终结果显示{ {1}}。我定义变量的方式有问题，还是最终值的计算？

Answer 1

因为parseInt( elementObject )没有返回有效的数字。

您想要使用基数

来解析值

var v1 = parseInt(numb1.value, 10);

当值实际发生变化时，你必须在函数内部。

另外，添加一些分号，并不总是需要它们，但最好添加它们，不要重新声明变量

var numb1 = document.getElementById("numb1");
var numb2 = document.getElementById("numb2");
var numb3 = document.getElementById("numb3");
var numb4 = document.getElementById("numb4");


function myFunction() {
    var v1 = parseInt(numb1.value, 10);
    var v2 = parseInt(numb2.value, 10);
    var v3 = parseInt(numb3.value, 10);
    var v4 = parseInt(numb4.value, 10);
    var t = 0;

    if (numb1.checked) {
        t = v1 + t;
    } else if (numb2.checked) {
        t = v2 + t;
    } else if (numb3.checked) {
        t = v3 + t;
    } else if (numb4.checked) {
        t = v4 + t;
    }
    
    document.getElementById("demo").innerHTML = t
}

<input id="numb1" type="radio" value="10">
<input id="numb2" type="radio" value="50">
<input id="numb3" type="radio" value="80">
<input id="numb4" type="radio" value="120">

<button type="button" onclick="myFunction()">Submit</button>

<p id="demo"></p>

Answer 2

我同意adeneo的回答。问题是你是parseInt HTML输入元素。

你已经得到了答案。

但我注意到您使用if..else

因此，您只希望用户选择一个值。

因此，有一种简短的方法也有助于提高加载速度和减少代码行。

使用forms

＆＃13;

function myFunction(){
    t=parseInt(document.forms[0]["num"].value);
    document.getElementById("demo").innerHTML=t
}

＆＃13;

<form>
<input id="numb1" name="num" type="radio" value="10">
<input id="numb2" name="num" type="radio" value="50">
<input id="numb3" name="num" type="radio" value="80">
<input id="numb4" name="num" type="radio" value="120">

<button type="button" onclick="myFunction()">Submit</button>
</form>
<p id="demo"></p>

＆＃13;

为什么这个功能的结果显示为NaN？

2 个答案: