我试图在单击上面的链接后将隐藏的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代码。为清晰起见,我没有将其包括在内。
如何解决这个问题?或者我的替代方案是什么?
答案 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/
</div>
.next()
对象执行.toggle
。slideToggle()
。答案 2 :(得分:0)
由于某种原因,如果我的CSS文件的链接标记位于HTML标记内,则无效。但如果我把它们留在外面,它就会弄乱我的造型。经过大量研究后,我发现jQuery或IE9中存在一个错误。当我运行我的控制台时,我点击链接时收到无效的呼叫错误。这个错误出现在我特定行的jQuery代码中。电话是this.appendChild( elem );
,但为了解决这个问题,我必须将其更改为this.parentNodeappendChild( elem );
并修复它。
所以万一以后其他人都有这个问题,如何修复它:
this.appendChild( elem );
更改为this.parentNode.appendChild( elem );