Question

我的HTML页面上有一个单选按钮：

<form name="myForm" onsubmit="calc_risk(); return false;" method="post">
    <input type="radio" name="q1" value="1"> Yes
    <input type="radio" name="q1" value="0"> No
    <input type="submit" value="Submit">
</form>

在我的javascript函数中，我可以通过以下方式访问该值：

function calc_risk () {
    var a = document.forms["myForm"]["q1"].value;
}

在firefox中，变量按预期包含1或0（取决于我选择的单选按钮）。在IE11中，值未定义。为什么单选按钮在IE11中不起作用？

修改

我现在正在使用jquery来访问值：

var radioValue = $("input[name='q1']:checked").val();

适用于两种浏览器。通过添加：

确保标题部分中包含jquery

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

Answer 1

能够访问HTMLFormControlsCollection上的value属性并获取其中第一个选中的单选按钮的值是web api规范中相对较新的功能。

Internet Explorer（一种旧的浏览器，除了安全补丁之外没有任何新的开发工作）不支持它。

您可以遍历集合并测试第一个已检查元素。

var a = get_first_checked_value(document.forms["myForm"]["q1"]);

function get_first_checked_value(form_controls) {
    for (var i = 0; i < form_controls.length; i++) {
        if (form_controls[i].checked) {
            return form_controls[i].value;
        }
    }
}

Answer 2

这是我的解决方案，并在IE 11和Chrome浏览器中进行了测试。

<html>
    <body>
        <form name="myForm" onsubmit="calc_risk(this); return false;" method="post">
            <input type="radio" name="q1" value="1"> Yes
            <input type="radio" name="q1" value="0"> No
            <input type="submit" value="Submit">
        </form>
        <script language="javascript">
            function calc_risk (theForm) 
            {
                var q1Values = theForm.q1;
                for (i=0 ;i<q1Values.length;i++)
                {
                    if(q1Values[i].checked)
                    {
                        alert(q1Values[i].value);
                    }
                }
            }
        </script>
    </body>
</html>

IE11中无法访问单选按钮值

2 个答案: