基本的Javascript HTML表单-OnClick无法正常工作（我确定这很明显吗？）

Question

这是JSFiddle链接： http : //jsfiddle.net/rTJw2/1/

这是HTML：

<label for="gender">Gender: </label>
<input type="radio" name="genderS" id="g1" value="male" checked="checked">Male</input>
<input type="radio" name="genderS" id="g2" value="female" >Female</input>
<br>
<input name="submit" type="submit" value="Select" onclick="scriptResult();"/>

<script type="Javascript">

function scriptResult(){

if (document.getElementById('g1').checked) {
var gender === "male"; 
} else if (document.getElementById('g2').checked) {
var gender === "female";   
};

 alert(gender);
};



</script>

我敢肯定这很明显。 我刚刚开始学习如何在页面上实现javascript，并且只想在按下“提交”按钮时运行该函数。

有任何想法吗？

Answer 1

在浏览器中使用开发人员工具运行它，您将看到var gender === "male";上的语法错误var gender === "male"; 和var gender === "female"; 。

===用于比较相等性，而不是分配值。 单个=用于分配值。

Answer 2

更新的JSFiddle： http : //jsfiddle.net/b59vR/

多个问题：

<script type="Javscript">

应该为<script type="text/javascript">

else if (document.getElementById('g2').checked) {
    var gender === "female";   
}; //There should not be a semicolon here, or at the end of the function

var gender === "male"; //You should not use a triple equals here.

而是使用= ，它用于设置变量

总共应该是：

function scriptResult(){
    if(document.getElementById("g1").clicked){
        var gender="male";
    }else{
        var gender="female";
    }
    alert(gender);
}

Answer 3

好的，首先。

由于函数的范围，这在jsfiddle中永远无法工作。 jsfiddle在onload事件上运行JS，这意味着函数scriptResult()包含在onload函数中，无法通过按钮调用。

更正，如果将JS的位置更改为“ head”而不是“ onload”，它将可以正常工作

其次，您要在if / else语句中声明性别变量。 也限制范围。 性别变量需要在声明之外声明。 并且仅在声明中分配。

第三，使用= ，而不是=== 。

function scriptResult() {

    var gender;

    if (document.getElementById('g1').checked) {
        gender = "male"; 
    } 
    else if (document.getElementById('g2').checked) {
        gender = "female";   
    }

    alert(gender);
}

Answer 4

这是我的建议

1. 不要命名为“提交”
2. ===是比较运算符，而不是赋值运算符，它是=
3. 正确拼写JavaScript否则将不会发生任何事情
4. 包装成表格并在内联时使用onsubmit，但最好在onload头中添加事件处理程序
5. 正确使用标签
6. 在JSFiddle中使用head而不是负载

像这个现场演示

window.onload=function() {
  document.getElementById("form1").onsubmit=function() {
    var gender = "unknown";
    if (document.getElementById('g1').checked) {
      gender = "male"; 
    } 
    else if (document.getElementById('g2').checked) {
      gender = "female";   
    }
    alert(gender);
  }
}

使用

<form id="form1">
  Gender:
  <input type="radio" name="genderS" id="g1" value="male"   checked="checked" /><label for="g1">Male</label>
<input type="radio" name="genderS" id="g2" value="female"/><label for="g2">Female</label>
<br>
<input type="submit" value="Select"/>
</form>  

Answer 5

我认为您有些地方不对劲，我重新整理了一下：

<script type="Javascript">

function scriptResult() {

    var gender = "";

    if (document.getElementById('g1').checked) {
        var gender = "male"; 
    } 
    else if (document.getElementById('g2').checked) {
        var gender = "female";   
    }

    alert(gender);
}
</script>