0

在单击上面的链接后，我试图将隐藏的 div 添加到 .slideDown()/.slideUp() 。div 具有显示属性“隐藏”。它在除 IE9 之外的所有浏览器中都可以正常工作。当我在 IE9 中单击我的链接时，没有任何反应，这意味着隐藏的 div 没有显示。但是，如果我将 div 的显示属性设置为“可见”，它会很好地切换。我尝试了 .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 代码中。为了清楚起见，我没有包括在内。

如何解决这个问题？或者我的选择是什么？

4

3 回答 3

0

$(this).next()从

<span class="toggle">

是

<li id="toggler">

而不是你想要展示的

<div class="hiddenDiv">

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

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

相反，这应该可以解决问题

于 2012-06-13T19:37:28.320 回答
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 没有</div>为 hiddenDiv关闭
  2. 我确保无论点击发生在哪里，它都会.next()从.toggle对象开始。
  3. 为了简单起见，我切换到slideToggle()了。
于 2012-06-13T19:47:18.187 回答
0

出于某种原因，如果我的 CSS 文件的链接标签在 HTML 标签内，它就不起作用。但如果我把它们留在外面，它就会影响我的造型。经过大量研究后，我发现 jQuery 或 IE9 中存在错误。当我运行控制台时，单击链接时出现无效调用错误。此错误出现在我的 jQuery 代码中，位于此特定行。电话this.appendChild( elem );只是为了修复它，我不得不将其更改为this.parentNodeappendChild( elem );并修复它。

因此，如果将来其他人遇到此问题，请按照以下方法解决：

  1. 根据您的 jQuery 版本，通过运行控制台检查有错误的行
  2. 转到该行并更改this.appendChild( elem );为this.parentNode.appendChild( elem );
于 2012-06-14T16:00:37.537 回答