Jquery скрыть / показать не работает в Firefox / Chrome

Question

У меня есть немного кода HTML / JQuery, который, кажется, работает только для IE 8. Я пытаюсь встроить виджет meebo chat в вики, добавив некоторый прямой HTML-код. Я не хочу, чтобы виджет загружался по умолчанию, так как это занимает немного времени, поэтому я помещаю его в div и скрываю его с помощью Jquery.

К сожалению, это работает только в Internet Explorer. В Firefox 3, когда я нажимаю на кнопку переключения, ничего не происходит. Когда я пытался в Google Chrome, текст показа / скрытия переключался, но виджет встраивания не показывался.

Кто-нибудь знает, если это проблема с использованием JQuery, или, возможно, проблема совместимости браузера? Существует много бэкэнд-вики-кода, который также может повлиять на проблему. Например, место, куда я встраиваю виджет, вложено как в таблицы, так и в другие элементы div. Может ли это вызывать проблемы с селекторами JQuery?

Любая помощь будет оценена.

Код Jquery:

$(document).ready(function(){

    $(".btn-slide").click(function(e){ 
       e.preventDefault();

       $("#meebo-panel").toggleClass("meebo-open").toggleClass("meebo-closed").toggleClass("meebo-hide").toggleClass("meebo-show");
       $(".btn-slide").toggleClass("show-text").toggleClass("hide-text");
       $(".show-hide-panel").toggleClass("green-panel").toggleClass("grey-panel");

       $(".meebo-show").show();
       $(".meebo-hide").hide();

       $(".show-text").text("Chat with me");
       $(".hide-text").text("Hide");
       return false;      
    });
});

Мой HTML:

<div class="show-hide-panel green-panel"><a href="#" class="btn-slide show-text">Chat now</a></div>
<div id="meebo-panel" class="meebo-closed meebo-hide">
    Test
</div>

РЕДАКТИРОВАТЬ: Кажется, что эта проблема возникает независимо от того, что находится в div. Я упростил пример, чтобы вместо него включить текст, так как считаю, что он немного упрощает код.

Answer 1

Я понял, в чем проблема. Проблема заключалась в том, что бэкэнд вики уже включал другую (и более старую) версию JQuery.

Чтобы это исправить, мне нужно было использовать базовую функцию JQuery noConflict ().

Мой код в итоге выглядел так:

<script type="text/javascript" src="jquery-1.3.1.min.js"></script>

<script type="text/javascript">

jQuery.noConflict();

jQuery(document).ready(function($){
    //Do jQuery stuff using $
        ...
        ...
});
</script>

Это исправило все проблемы конфликтующих библиотек JQuery.

Answer 2

ты, JS, хорошо, приятель, я думаю. что-то не так с вашей разметкой.

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

тег объекта для ie Вставить для FF

надеюсь, это поможет