时间戳

首页 > 解决方案 > 如何在Javascript中比较id

javascript - 如何在Javascript中比较id

问题描述

我试图比较一个简单的代码，如果用户单击按钮，那么输出将显示适当的答案，但我似乎找不到任何正确的方法来做到这一点。

<!DOCTYPE html>
<html>
<body>
<p>Gender</p>
	<label><input type="radio" name="gender" id="male" value="Male">Male</label>
    <label><input type="radio" name="gender" id="male" value="Female">Female</label>
	<br>
	<br>
    <button onclick="myFunction()">Try it</button>
    <p id="demo">
<script>
function myFunction() {
  var x = document.getElementById("demo").value;
  var m = document.getElementById("male").value;
  var f = document.getElementById("female").value;
  	if(x === m)
  		x.innerHTML = "You are male.";
    else if(x === f)
    	x.innerHTML = "You are female.";
}
</script>

</body>
</html>

标签： javascripthtml

解决方案

您想要以下内容：

    <html>
    <body>
        <p>Gender</p>
        <label><input type="radio" name="gender" id="male" value="Male">Male</label>
        <label><input type="radio" name="gender" id="female" value="Female">Female</label>
        <br>
        <br>
        <button onclick="myFunction()">Try it</button>
        <p id="demo">
            <script>
                function myFunction() {
                    var x = document.getElementById("demo");
                    var m = document.getElementById("male").checked;
                    var f = document.getElementById("female").checked;
                    if (m)
                        x.innerHTML = "You are male.";
                    else if (f)
                        x.innerHTML = "You are female.";
                }
            </script>
    
    </body>
    </html>

首先你有两个男性输入的 id，你希望女性输入是女性：

 <label><input type="radio" name="gender" id="female" value="Female">Female</label>

其次，您想获取是否选中了单选按钮，而不是它的值：

 var m = document.getElementById("male").value; // returns Male in your case
 var m = document.getElementById("male").checked; // returns true or false depending on whether it's been checked

然后逻辑需要一点改动：

  if (m)  // they selected male
      x.innerHTML = "You are male.";
  else if (f) // they selected female
      x.innerHTML = "You are female.";

推荐阅读