IE9 错误:对象不支持属性或方法“setAttribute”

IE9 error: Object doesn't support property or method 'setAttribute'

本文关键字：方法 setAttribute 属性 错误 对象 不支持 IE9      更新时间：2023-09-26

Function：

function disable_hidden_flip_questions(option, value){
    var first_q = document.getElementById('hidden_auto_questions');
    var second_q = document.getElementById('hidden_include_auto');
    var inputs_list = [];
    if(option == 'all'){
        inputs_list.push(first_q.getElementsByTagName("input"));
        inputs_list.push(second_q.getElementsByTagName("input"));
    }else if (option == 'first'){
        inputs_list.push(first_q.getElementsByTagName("input"));
    }else if(option == 'second'){
        inputs_list.push(second_q.getElementsByTagName("input"));
    }
    for (var inputs in inputs_list){
        for(var input in inputs_list[inputs]){
            if(inputs_list[inputs].hasOwnProperty(input) && input != 'length'){
                if(!value){
                    inputs_list[inputs][input].removeAttribute('disabled');
                }else{
                    inputs_list[inputs][input].setAttribute("disabled", "disabled");
                }
            }
        }
    }
}
在

Chrome和Firefox中运行良好，但是在IE9中，控制台在此行上给我一个错误：

inputs_list[inputs][input].setAttribute("disabled", "disabled")

如果我console.log(inputs_list[inputs][input])我在 Chrome 中得到这个：

（输入由 RoR 生成，这就是为什么它的name和id如此之长）

<input class="radio_buttons optional" id="custom_attributes_trailer_insurance_endorsement_false" name="custom_attributes[trailer_insurance_endorsement]" type="radio" value="false" disabled="disabled">

是的，这就是我想要的（和期望的）...但是在IE9的控制台中，我得到这个：

[object HTMLCollection]

这完全没用....

那么问题：在IE的崇高观点中，我哪里出错了？我知道IE9支持setAttribute，所以我假设它与我的for...in循环有关。

编辑：所以由于注释，问题可能出在对象类型（HTMLCollection存储在Array中）。如果确实如此，我该如何使所有数据类型兼容？

HTMLCollections 并不是真正的数组，因此以这种方式处理它们可能会得到不一致的结果。虽然所有浏览器都会从getElementsByTagName返回HTMLCollection，但它们在允许您如何处理它们方面可能存在重大差异。最好的方法是使用 DOM 方法从 HTMLCollection 访问内容 - 因此您将使用 .item（0） 来确保引用的是 dom 节点而不是集合本身（请参阅 https://developer.mozilla.org/en-US/docs/DOM/HTMLCollection）。此外，您不会尝试操作集合列表，因此，如果您确实使用数组将数据推送到，请确保它们是单独的数据而不是 HTMLCollection。

jquery中的解决方案： 

  $("input[name=trailer_use]").click(function(event){
        if(event.target.id == "trailer_use_yes"){
            $("#hidden_auto_questions").removeClass('hide_auto').addClass('show_auto');
            $("input[name=trailer_insured]").removeAttr("disabled");
            show_trailer_warning(null, "remove");
        }else {
            $("#hidden_auto_questions").removeClass('show_auto').addClass('hide_auto');
            $("input[name=trailer_insured]").attr("disabled", "disabled");
            if($("#hidden_include_auto").hasClass("show_auto")){
                $("#hidden_include_auto").removeClass('show_auto').addClass('hide_auto');
                $('input[name="custom_attributes[trailer_insurance_endorsement]"]').attr("disabled", "disabled");
            }
            show_trailer_warning(null, "disclaimer");
        }
  });
相关文章：