Question

我正在创建一个网站，其中JavaScript正在读取表单的输入，但是当我执行警报时，它表示输入的值未定义。那是为什么？

这是我的表格：

<form action="" method="post" id="reportform">
                <input type="radio" name="report" value="customer"><p>Customers</p>
                <input type="radio" name="report" value="item"><p>Items Sold</p>
                <input type="radio" name="report" value="department"><p>Sales Departments</p>
                <input type="radio" name="report" value="person"><p>Sales People</p>
                <input type="button" name="reportsubmit" value="Submit" onClick="readText(this.form)">
</form>

这是我的JavaScript：

<script>
            function readText (form) {
            var radio = form.report.value;
            alert("You entered: " + radio);
        }
</script>

Answer 1

您可以从已选中复选框中读取值，如下所示：

function readText(form) {
  var checked = form.querySelector('input:checked');
  var value = checked ? checked.value : null;
  // do something with `value`
}

element.querySelector()适用于IE8 + 我认为:checked是一个CSS3的东西，所以也许IE9 +。

http://jsfiddle.net/rudiedirkx/mzCV8/1/

Answer 2

您必须检查checked属性以测试选中哪个单选按钮：

function readText (form) {
    var radios = form.report;
    for(var i = 0; i < radios.length; i++){
        if(radios[i].checked){
            rate_value = radios[i].value;
            alert("You entered: " + rate_value)
        }
    }
}

或者，如果你使用jQuery，你可以简单地使用：

$('#reportform input[name="report"]:checked').val();

Answer 3

您的代码适用于我： http://jsfiddle.net/mzCV8/

确保js代码位于表单前面

    function readText (form) {
    var radio = form.report.value;
    alert("You entered: " + radio);
}

输入值未正确读取，显示为未定义的JavaScript

3 个答案: