IE 11: объект не поддерживает свойство или метод 'getElementsByClassName' - PullRequest
Новая
       46

IE 11: объект не поддерживает свойство или метод 'getElementsByClassName'

1 голос
/ 23 мая 2019

Это не дубликат. Предыдущие вопросы относятся к IE8. Это происходит в IE11.

У меня нет проблем с запуском этого в Chrome или Firefox, но мой код должен работать в IE11, и я получаю следующую ошибку:

Объект не поддерживает свойство или метод 'getElementsByClassName' 

function showNext(a) {
    var questions = document.getElementsByClassName("questionholder");
    showRequired.style.display = "none";

    for (var i = 0; i < questions.length; i++) {
        questions[i].style.display = "none";
    }

    var nextQuestion = document.getElementById("question" + a);

    if (nextQuestion !== null) {
        nextQuestion.style.display = "inline-block";
    }
}

Код должен быть здесь: 

<form id="TheForm" style="display:block;">
    <div class="questionholder" id="question0" style="display:block">
        <a class="text2button" onclick="showNext(1)">Start</a>
    </div>
    <div class="questionholder" id="question1" style="display:block">
        <a class="text2button" onclick="showNext(2)">Q1</a>
    </div>
    <div class="questionholder" id="question2" style="display:block">
        <a class="text2button" onclick="showNext(3)">Q2</a>
    </div>
</form>

Приведенный выше код скроет все div и затем покажет div, соответствующий идентификатору «question» + a, как определено по нажатой кнопке.

Что я могу сделать, чтобы устранить вышеуказанную ошибку?

Ответы [ 2 ]

0 голосов
/ 23 мая 2019

Исправление выглядит следующим образом: 

<meta http-equiv="X-UA-Compatible" content="IE=11" />
0 голосов
/ 23 мая 2019

Что я могу сделать, чтобы устранить вышеуказанную ошибку?

Никогда не используйте .getElementsByClassName() снова и вместо этого используйте .querySelectorAll(). 

function showNext(a) {
    var questions = document.querySelectorAll(".questionholder");
    //showRequired.style.display = "none";

    for (var i = 0; i < questions.length; i++) {
        questions[i].style.display = "none";
    }

    var nextQuestion = document.getElementById("question" + a);

    if (nextQuestion !== null) {
        nextQuestion.style.display = "inline-block";
    }
}

showNext(2);
<form id="TheForm" style="display:block;">
    <div class="questionholder" id="question0" style="display:block">
        <a class="text2button" onclick="showNext(1)">Start</a>
    </div>
    <div class="questionholder" id="question1" style="display:block">
        <a class="text2button" onclick="showNext(2)">Q1</a>
    </div>
    <div class="questionholder" id="question2" style="display:block">
        <a class="text2button" onclick="showNext(3)">Q2</a>
    </div>
</form>
...