Код не работает при добавлении document.ready

#javascript #jquery

Вопрос:

приведенный ниже код отлично работает на jsFiddle без $(document).ready(function() { и закрывающих скобок. (пример:http://jsfiddle.net/cEDYD / ) но как только я размещаю код на своей веб-странице с готовым документом, он перестает работать. Я что-то упускаю? Я включил jquery

 <script type="text/javascript">
$(document).ready(function() {
    function showDiv(element, pro2) {
        if (pro2.children("option:selected").val() == "cpl") element.show();
        else element.hide();
    }

    var myElement = $("div#pro2");
    var mypro2 = $("select#ptype");

    $("select").change(function() {
        showDiv(myElement, mypro2)
    });
});
</script>

1. Что-нибудь в консоли JavaScript?

2. У меня работает нормально. Как правило, объявления функций следует оставлять за пределами области действия функции ready.

3. @jli — Я предпочитаю внутри области document ready, если это единственное место, где они используются. Да, это делает готовый документ более беспорядочным, но это может помочь предотвратить столкновения с другим кодом.

4. @nnnnnn Я думаю, в данном случае это скорее предпочтение.

5. @acctman да, у меня это работает. Я просто использую встроенную консоль для Chrome или, если я использую Firefox, я использую Firebug.

Ответ №1:

Есть ли причина, по которой вы не хотели бы, чтобы это было завернуто в обработчик document ready?

Похоже, что DOM не готов во время выполнения вашего javascript.

Проверьте консоль javascript. Google Chrome отлично подходит для отладки JS.

Ответ №2:

проблема заключалась в неправильном вводе символа в моем файле css. -спасибо за тестирование, ребята

Ответ №3:

В вашем jsfiddle есть настройка, которая автоматически переносит код в document.ready() . Вот почему он работает без ready() в jsFiddle (смотрите, где написано onload на верхней левой панели).

document.ready() необходим на обычной веб-странице, если вы не разместите javascript после основного HTML.