Jquery .show()在Firefox中无法正常工作

Question

Jquery .show()在Firefox中无法正常工作

11

我在Firefox中使用jquery show函数遇到了问题。

情况：我在弹出窗口（fancybox）中加载了一个带有aspx页面的iframe。在该aspx页面中，我有一个带有onclick事件的按钮，该事件调用自定义函数并在该函数中对div上的.show()函数进行操作。该div具有包含display:none;样式元素。在IE，Safari和Chrome中，这能够顺利运行。甚至在以独立方式加载aspx页面时，Firefox也可以正常工作。但是，在fancybox-iframe弹出窗口中，它不能正常工作。我没有收到JavaScript错误消息。即使从style属性中删除了display:none，div仍然不会显示出来。

页面的HTML：

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

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

        parent.sizeFancybox();
    }

弹出窗口所在的按钮是一个带有fancyboxiframe类的锚点。Fancybox将自动生成用于显示弹出窗口的js代码。

我已经查看了这些主题：

我已经检查过我的html是否有效，它是有效的。

你有什么想法吗？

BHD

- Maarten Kieft

你尝试过使用 $("#psharebutton").toggle(); 吗？ - S Philp

我没有代码可以再现了 :( 对此感到抱歉。 - Maarten Kieft

4个回答

2

我遇到了类似的问题。我在我的CSS中设置了以下内容：

body { display: none }

并尝试在jQuery中更改此内容：

$("body").show();

之前在Firefox浏览器中无法正常工作。

后来我将HTML代码更改为

<body style="display: none">

通过从CSS中移除该部分，我能够完美地使用jQuery show()功能。

看起来，在Firefox中，CSS规则的继承方式与IE/Chrome不同。

- Markus Bucher

谢谢你的回答，对其他人可能也有帮助 :) - Maarten Kieft

1

只需像 $("#psharebutton").attr('display','') 或 $("#psharebutton").attr('display','block') 这样写下即可。

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

        parent.sizeFancybox();
    }

- DJ.

请看我在 Kirk 的评论中的留言 :) - Maarten Kieft

0

这可能只是js错误的副作用。值得一试的是按下F12并查看控制台中是否有任何js错误。我曾经遇到过类似的问题，无法弄清楚为什么在Firefox上具有“display:none”样式的输入框上 .show() 方法不起作用，结果发现我有一个格式不正确的选择器，缺少一个闭合的]，并抛出了一个你看不到的错误，直到你打开Firebug。Chrome更加宽容，显示了按钮，而Firefox捕获了错误的选择器。

- Brendan

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Kirk Liemohn · Accepted Answer

我遇到了类似的问题，我的解决方法是：

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

取而代之

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

在 jQuery 中，"show" 方法相当于将 display 样式属性设置为 "block"。我发现在 Firefox 和 Chrome 中，还需要将其设置为 "inline-block" （但在 IE 中则不需要）。我认为（但未确认）jQuery 足够智能，可以知道前一个 display 值并使用它，但在我的情况下，初始时 display 设置为 "none"，因此没有前一个值。