Javascript 为什么单选按钮或复选框按钮数组中的element.type返回“0”；“未定义”；

我在这里面临一个非常奇怪的情况。假设我有一个表单，有三个输入元素，类型为radio，如下所示

<form>
    <input type="text" name="donor" value="" />Heart
    <input type="radio" name="organ" value="10" />Heart
    <input type="radio" name="organ" value="20" checked="checked" />Lungs
    <input type="radio" name="organ" value="30" />Kidney    
</form>

将返回类型radio，而不是undefined。不过，这个

alert("input type: " + document.forms[0].organ[0].type);  

返回类型radio，当然这不是我想要的。你可以看到魔法

有人知道发生了什么事吗

第一次更新

如果我们处理复选框，也会发生同样的情况，这意味着在不指定索引的情况下，无法确定收音机数组或复选框按钮上的元素类型

换句话说，这个片段

var i, form = document.forms[0], fields = ['donor', 'organ'];

for(i = 0; i < fields.length; i++) {
    switch(form[fields[i]].type) {
        case 'radio':
            alert('(a) - I can beat up Chuck Norris');
            // anyway, no one hears this :)
            break;
        case 'checkbox':
            break;
        case 'text':
            alert('(a) - Chuck Norris is unbeatable');
            break;
    }
}

---

如果您添加以下行，则可以看到该秘密：

alert(document.forms[0].organ.toString());

您将看到它创建了一个

RadioNodeList

，这是一个类似于数组的结构

因为所有相关的单选按钮都有相同的名称，但元素不同，所以必须以这种方式访问它们以设置状态

如果确实必须在不使用数组语法的情况下访问它们，则可以为每个单选按钮指定一个唯一的ID：

<form>
    <input type="radio" id="radio_1" name="organ" value="10" />Heart
    <input type="radio" id="radio_2" name="organ" value="20" checked="checked" />Lungs
    <input type="radio" id="radio_2" name="organ" value="30" />Kidney
</form>

<script>
    alert("input type: " + document.forms[0].organ[0].type);

    alert(document.forms[0].organ.toString());

    alert("input type: " + document.getElementById("radio_1").type);
</script>

心
肺
肾
警报（“输入类型：+文档.表格[0].机关[0].类型”）；
警报（document.forms[0].Organger.toString（））；
警报（“输入类型：”+document.getElementById（“radio_1”）.type）；

不会的！Radio是一些特殊的表单控件元素，因为它们允许具有相同名称的多个实例

form.inputRadio

将引用输入[type=radio]元素的集合。您的回答没有解决我的问题，但至少您确认了我的疑问。感谢您提供的

toString（）

提示：）

var form = document.forms[0], fields = ['donor', 'organ'];

for (var key in fields) {
    switch(form[key].type){
        case 'select-one':
            break;
        case 'select-multiple':
            break;
        case 'checkbox': // we are dealing with a single checbox button 
            break;
        case 'text': case 'textarea': case 'hidden': case 'password':
            break;
        default:
            if(form[key][0].type == radio' || form[key][0].type == radio' == 'checkbox') {
                // we're dealing with an array of radio or checkbox buttons, otherwise
            }else{
                console.log("Something went wrong!");
            }
            break;
    }
}

alert(document.forms[0].organ.toString());

<form>
    <input type="radio" id="radio_1" name="organ" value="10" />Heart
    <input type="radio" id="radio_2" name="organ" value="20" checked="checked" />Lungs
    <input type="radio" id="radio_2" name="organ" value="30" />Kidney
</form>

<script>
    alert("input type: " + document.forms[0].organ[0].type);

    alert(document.forms[0].organ.toString());

    alert("input type: " + document.getElementById("radio_1").type);
</script>