Скрипт jQuery, работает в Firefox, а не в IE, Chrome

#javascript #jquery

Вопрос:

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

Скрипт отлично работает в Firefox, однако в IE и Chrome он просто не работает: (

Может кто-нибудь посоветовать?

Большое спасибо! вот скрипт.

(OCH var принимает высоту контейнера, в который элементы загружаются через ajax, поэтому он знает, когда его снова открывать, на сколько пикселей открывать — это лучший способ?)

             $(document).ready(function()
            {
                //Grab the height of the container after its loaded with all the calls in...
                var och = $('#calls').height();
                //Are we allowed to close this panel yet?
                var enabled = false;
                //is the panel closed or not?
                var closed = false;
                $(".survey-description").click(function () {
                    if (enabled == true) {
                        if (closed == false) {
                            $(this).closest("#calls").stop().animate({"height": "44px"}, "fast");
                            closed = true;
                        }
                        else {
                            $(this).closest("#calls").stop().animate({"height": och}, "medium");
                            closed = false;
                        }
                    }
                });

                $(".linktoCall").click(function () {
                    if (closed == false) {
                        //Now we can toggle the top panel...
                        enabled = true;
                        $(this).closest("#calls").stop().animate({"height": "44px"}, "fast");
                        closed = true;
                    }
                });

            });

РЕДАКТИРОВАТЬ вот некоторые html отображаемых элементов.

 <div id="survey-description"></div>
<div id="calls">
    <div>
        <p onclick="showCall('tgkn5xabgnivkaf');" id="notstarted" class="linktoCall">59677 tgkn5xabgnivkaf<br>NOT STARTED - SAVED</p>
    </div>
</div>

<div id="aCall">
</div>

1. «не работает» — не лучшее описание проблемы — вам нужно быть более конкретным в отношении того, что работает, а что нет. Вы получаете какие-либо сообщения об ошибках в консоли разработчика?

2. Он не скользит вверх и вниз? Вот как это не работает. Он остается статичным. Ошибка, которую я получаю в chrome dev tools

3. «Неперехваченная ошибка типа: не удается прочитать свойство ‘length’ null»

4. Где находится элемент с классом survey-description ?

5. Переиздано. это просто кнопка div над всеми остальными.

Ответ №1:

Глядя на фрагмент HTML, я думаю, это должно быть

 <div class="survey-description"></div>

потому что селектор $('.survey-description') ссылается на класс, а не на идентификатор.

Ответ №2:

В основном это быстрое предположение, поскольку я не знаю структуру html, о которой идет речь, и у меня нет времени проверять остальное, но если есть конфликтующие идентификаторы элементов (например, два элемента с идентификатором «вызовы»), разные браузеры будут вести себя по-разному. Поэтому проверьте, проверьте ли это, чтобы убедиться, что это не проблема.

(Кроме того, используйте === в сравнениях вместо ==)

Ответ №3:

это может не сработать, если ваш html-код недействителен … и я уверен, что вы не закрыли div или что-то в этом роде…

Вы можете проверить здесь свою страницу: http://validator.w3.org /

Пожалуйста, также удалите только для проверки значение «px» из

 animate({"height": "xxpx"} ...

и пусть это

 animate({"height": 25}...