ie9中的jquery问题(.slidedown(),. hide())

时间:2012-06-13 19:31:09

标签: jquery internet-explorer-9 slidedown

我试图在单击上面的链接后将隐藏的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代码。为清晰起见,我没有将其包括在内。

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

3 个答案:

答案 0 :(得分:0)

来自

$(this).next()

<span class="toggle">

<li id="toggler">

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

<div class="hiddenDiv">

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

$('#toggler').find('.hiddenDiv') 
而应该解决问题

答案 1 :(得分:0)

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

$(document).ready(function() {

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

});​

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

  1. 您的问题中的HTML对于hiddenDiv
  2. 没有结束</div>
  3. 我确保无论点击发生在何处,都会从.next()对象执行.toggle
  4. 为简单起见,我切换到slideToggle()

答案 2 :(得分:0)

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

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

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