document.getElementByID не работает в IE 8

Question

Я никогда не делал этого раньше, поэтому я прошу прощения, если я не описываю свою проблему достаточно хорошо или не использую весь правильный синтаксис.

На моем веб-сайте есть форма электронной почты. Пользователь может ввести сообщение вместе с его именем и некоторыми другими данными. Как только они заканчивают заполнять форму, они могут отправить ее, и она отправляется на мою электронную почту, и все хорошо. Поскольку форма содержит JavaScript, я автоматически скрыл ее с помощью CSS, а затем сделал ее видимой через JavaScript. Таким образом, если у пользователя отключен JavaScript, форма не появится.

И это прекрасно работает. И я подумал, что это тоже отлично. Я проверил его во всех своих локальных тестирующих браузерах (Chrome 21, FF 14, IE 9, Opera 12 и Safari 5), а также в лаборатории Adobe Browser для IE 8, 7 и 6. Во всех них это выглядело фантастически. Я даже проверил это на своем телефоне Android и Blackberry моей подруги. Выглядело хорошо.

Пока я не проверил его на компьютере моей мамы с IE 8. Хотя в Adobe Browser lab написано, что форма отображается, в реальном тесте форма не отображается.

Вы можете проверить это здесь.

Проблема связана с идентификатором формы "emailForm". Моя форма имеет разметку примерно так:

    <form id="emailForm" method="POST" action="../javascript/email_form.php" onSubmit="return validateForm();">
        <label id="emailSubjectLabel">Email Subject*:</label><input class="form" title="Email Subject" type="text" name="subject" id="emailSubject"><br>
        <label id="nameLabel">Your Name*:</label><input class="form" title="Your Name" type="text" name="name" id="yourName"><br>
        <label id="emailLabel">Your Email:</label><input class="form" title="Your Email Address" type="text" name="email" id="yourEmail"><br>
        <label id="messageLabel">Your Message*:</label>
        <textarea class="form" title="Write Something..." name="message" id="message" cols="40" rows="5"></textarea>
        <input class="button" type="submit" value="Submit">
        <p class="error">* required.</p>
    </form> 

Мой CSS имеет целый набор кода, но он имеет это в отношении того, чтобы сделать форму невидимой:

    #emailForm, #javaText {
        display: none;  
    }

(примечание: #javaText - это некоторый текст на экране, который также является скрытым, если только у пользователя не установлен JavaScript. Он также не работает в IE 8. Просто для простоты я не упоминаю об этом.)

И JavaScript выглядит так:

    document.getElementById("emailForm").style.display = "block";
    document.getElementById("javaText").style.display = "inline";

    function validateForm() {
    //function that validates the form
    }

Я поместил JavaScript в нижней части страницы, надеясь, что это поможет. Я попытался изменить стиль содержимого прямо на главной странице HTML, я проверил JavaScript моей матери, и он включен. Я просто не знаю, почему это не работает.

Если бы кто-то мог сказать мне, что я делаю неправильно, я был бы очень благодарен. Это дало мне головную боль в течение недели.

(И да, я сказал ей, что IE отстой, и она должна пойти с Chrome, но причина, по которой она этого не делает, это совсем другая история...)

Спасибо за вашу помощь. Я не могу ждать, чтобы услышать, что решение!

Answer 1

IE8 не загружает ваш form_validation.js файл, и именно поэтому он не запускает ваш код инициализации в этом файле.

You need to change the type on your script tag to type="text/javascript" or remove the type entirely. У тебя есть type="application/javascript" что не правильно.

After further exploration, see /questions/22772869/pochemu-ie8-ne-raspoznaet-typeapplicationjavascript-v-tege-skripta для дальнейшего обсуждения.