将 javascript 中的值引入单选按钮

Question

我希望根据用户输入的数字符号来检查我的单选按钮。这是我的代码：

<!DOCTYPE html>
<html>
<body>
<script>
function func1(x, y){

    var z = x + y
    document.getElementById("Z").innerHTML = z;
    var Sign1
    if (z < 0) {

        Sign1 = "pos";
    }
    else {

        Sign1 = "neg";
    }
}                           

</script>
<form >
first input:<br>
<input id="Y" type="text" y="Y" value=85>
<br>
second input:<br>
<input id="X" type="text" x="X" value=15>
<br> 
The Answer:<br>
<input id="Z" type="text" z="Z" > 
 <br>
<input type="radio" name="sign" value="pos" checked> positive
<input type="radio" name="sign" value="neg"> negative

<br><br>
</form>
<button type="button" onclick="func1(parseInt(document.getElementById('X').value),parseInt(document.getElementById('Y').value))">Try it</button>
</body>
</html>

这里根据z的值。我应该如何在javascript代码单选按钮中引入这个值和条件？

Answer 1

将此代码添加到函数的末尾：

var elements = document.getElementsByName("sign");
for(var i = 0; i < elements.length; i++) {
  elements[i].checked = elements[i].value === Sign1;
}

这会遍历名称为 "sign" 的所有 DOM 个元素——在您的例子中，这些都是您的单选按钮。如果单选按钮的 value 与您的 Sign1 变量匹配，则选中单选按钮，否则将其标记为未选中。

我认为您对 pos 与 neg 的逻辑检查是相反的，但我不确定您的确切意图。您可以在下面的代码片段中看到一个可运行的示例。

function func1(x, y){

    var z = x + y
    document.getElementById("Z").innerHTML = z;
    var Sign1;
    if (z < 0) {

        Sign1 = "pos";
    }
    else {

        Sign1 = "neg";
    }
  
  var elements = document.getElementsByName("sign");
  for(var i = 0; i < elements.length; i++) {
    elements[i].checked = elements[i].value === Sign1;
  }
}

<form >
first input:<br>
<input id="Y" type="text" y="Y" value=85>
<br>
second input:<br>
<input id="X" type="text" x="X" value=15>
<br> 
The Answer:<br>
<input id="Z" type="text" z="Z" > 
 <br>
<input type="radio" name="sign" value="pos" checked> positive
<input type="radio" name="sign" value="neg"> negative

<br><br>
</form>
<button type="button" onclick="func1(parseInt(document.getElementById('X').value),parseInt(document.getElementById('Y').value))">Try it</button>

Answer 2

你可以这样做：

var func1 = function (){
   var x, y, z;
   x= Number(document.getElementById("X").value);
   y= Number(document.getElementById("Y").value);
   z= x + y;
   
   document.getElementById("Z").value =  z;
    
    if (z < 0) {
  document.getElementById("neg").checked=true;
    }
    else {
        document.getElementById("pos").checked=true;
    }
}

<html>
<head>
<title>Untitled Document</title>

</head>

<body>
<form>
first input:<br>
<input id="Y" type="text" value=85>
<br>
second input:<br>
<input id="X" type="text" value=15>
<br> 
The Answer:<br>
<input id="Z" type="text" > 

<input type="radio" name="sign" id="pos"> positive
<input type="radio" name="sign" id="neg"> negative
<br>

<button type="button" onclick="func1()">Try it</button>
</form>
</body>

</html>

将 javascript 中的值引入单选按钮

Introducing a value in javascript to radio buttons

javascript

html

input

radio-button

output