Question

我试图在单击上面的链接后将隐藏的div添加到.slideDown（）/。slideUp（）。 div具有显示属性'hidden'。它在IE9的每个浏览器中完全正常。当我在IE9中单击我的链接时没有任何反应，这意味着隐藏的div没有显示。但是如果我将div的display属性设置为'visible'，它就会很好地切换。我试过.show（）/。hide（）和.toggle（），但我得到了相同的结果。知道如何解决这个问题吗？

这是我的HTML代码

<span class="toggle">
<li id="toggler">
    <a id="atoggler1" href="#">
        '.$info['category'].'
    </a></li></span>
<div class="hiddenDiv">
<p>
    $info['description']
</p>
.....
.....
 </div>

这是我的CSS代码

.hiddenDiv{
    display: none;
 }

这是我的JavaScript

$(document).ready(function() {

$(".toggle").click(function () {

    // check the visibility of the next element in the DOM
    if ($(this).next().is(":hidden")) {
        $(this).next().slideDown("fast"); // slide it down
        return false;
    } else {
        $(this).next().slideUp("fast"); // hide it
        return false;
      }
  });
});

也只是为了记录我的HTML代码包裹PHP代码。为清晰起见，我没有将其包括在内。

如何解决这个问题？或者我的替代方案是什么？

Answer 1

来自

的

$(this).next()

<span class="toggle">

是

<li id="toggler">

而不是你想要展示的是什么

<div class="hiddenDiv">

根据你的标记。如果你使用

$('#toggler').find('.hiddenDiv')

而应该解决问题

Answer 2

修复HTML中缺少的关闭div并修改代码以定位正确的div后，这在IE9中对我来说很好用：

$(document).ready(function() {

    $(".toggle").click(function () {
        $(this).closest(".toggle").next().slideToggle("fast");
        return(false);
    });

});

工作演示：http://jsfiddle.net/jfriend00/d3TX9/

您的问题中的HTML对于hiddenDiv

</div>

我确保无论点击发生在何处，都会从.next()对象执行.toggle。
为简单起见，我切换到slideToggle()。

Answer 3

由于某种原因，如果我的CSS文件的链接标记位于HTML标记内，则无效。但如果我把它们留在外面，它就会弄乱我的造型。经过大量研究后，我发现jQuery或IE9中存在一个错误。当我运行我的控制台时，我点击链接时收到无效的呼叫错误。这个错误出现在我特定行的jQuery代码中。电话是this.appendChild( elem );，但为了解决这个问题，我必须将其更改为this.parentNodeappendChild( elem );并修复它。

所以万一以后其他人都有这个问题，如何修复它：

根据您的jQuery版本，通过运行控制台检查错误行
转到该行并将this.appendChild( elem );更改为this.parentNode.appendChild( elem );

ie9中的jquery问题（.slidedown（）,. hide（））

3 个答案: