Jquery.show() не работает в Firefox

У меня проблема с функцией jquery show в firefox.

Ситуация: я загрузил iframe со страницей aspx во всплывающем окне (fancybox). На этой странице aspx у меня есть кнопка с событием onclick, которое вызывает пользовательскую функцию, и в этой функции она запускает функцию .show() для div. Этот div имеет элемент стиля, который содержит: display:none;.

Это работает в IE, сафари, хроме. Это работает даже в firefox, когда я загружаю страницу aspx отдельно. Он не работает в Firefox во всплывающем окне fancybox-iframe. Я не получаю ошибок javascript. Даже display:none удаляется из атрибута стиля, но div не отображается.

HTML со страницы

<div class="popupWrapper">
  ..some elements
  <div id="psharebutton" style="display:none;"> 
   ..content of the div
  </div>
</div>

Код JavaScript:

function dolinkedin(url, title, summary, source) {
        $(".smbutton").addClass("buttonDisabled");
        $("#linklinkedin").removeClass("buttonDisabled");
        $("#psharebutton").show();

        parent.sizeFancybox();
    }

Кнопка, на которой вызывается всплывающее окно, является якорем, который имеет класс fancyboxiframe. Fancybox автоматически сгенерирует код js для отображения всплывающего окна.

Я проверил эти темы:

Я проверил, действителен ли мой html, и это так.

Любая идея?

BHD


person Maarten Kieft    schedule 01.09.2011    source источник
comment
Вы пробовали $(#psharebutton).toggle(); ?   -  person S Philp    schedule 01.09.2011
comment
У меня больше нет кода для воспроизведения :( Извините за это   -  person Maarten Kieft    schedule 15.11.2013


Ответы (4)


У меня была аналогичная проблема, и мое решение состояло в том, чтобы сделать

$("#psharebutton").css("display", "inline-block");

вместо

$("#psharebutton").show();

«Показать» jquery идентично установке атрибута стиля отображения в «блок». Я обнаружил, что мне нужен встроенный блок для Firefox и Chrome (мне это не нужно для IE). Я считаю (но не подтвердил), что jquery достаточно умен, чтобы знать, что такое предыдущее отображаемое значение, и использовать его, но в моем случае я начал с отображения, установленного на «нет», поэтому предыдущего значения не было.

person Kirk Liemohn    schedule 15.08.2012
comment
Ваш ответ и ответ DJ, вероятно, были решением, к сожалению, я больше не могу его воспроизвести, но, увидев подобное поведение, я совершенно уверен, что это действительно так. Я проголосовал за оба ваших ответа. - person Maarten Kieft; 15.11.2013

Просто напишите, например, $("#psharebutton").attr('display','') или $("#psharebutton").attr('display','block').

function dolinkedin(url, title, summary, source) {
        $(".smbutton").addClass("buttonDisabled");
        $("#linklinkedin").removeClass("buttonDisabled");
        $("#psharebutton").attr('display','');

        parent.sizeFancybox();
    }
person DJ.    schedule 01.03.2012
comment
Смотрите мой комментарий на kirk :) - person Maarten Kieft; 15.11.2013

У меня была аналогичная проблема. Я установил это в своем css:

body { display: none }

и попытался изменить это в jQuery:

$("body").show();

который не работал в Firefox.

После того, как я изменил HTML на

<body style="display: none">

и удалив часть из CSS, я смог использовать jQuery show(); безупречный

Кажется, что наследование правил css не следует той же процедуре в Firefox, что и в IE/Chrome.

person Markus Bucher    schedule 06.02.2014
comment
Спасибо за ваш ответ, он может быть полезен для других :) - person Maarten Kieft; 07.02.2014

Это может быть просто побочным эффектом ошибки js. Всегда стоит нажать F12 и посмотреть, нет ли ошибок js в консоли. У меня была аналогичная проблема, когда я не мог понять, почему .show() не работал на входе, который имел стиль «display: none» в Firefox, и оказалось, что у меня был плохо сформированный селектор, в котором отсутствовал закрытие ] и выдает ошибку, которую вы не видите, пока не откроете Firebug. Chrome более терпимо показывал кнопку, в то время как Firefox ловил плохой селектор.

person Brendan    schedule 04.03.2015