我有以下脚本,当单击链接时显示一个 div...
$(document).ready(function() {
$('.accordion ul li h1').click(function() { $(this).parent().parent().find('.ac:visible').slideToggle().parent().removeClass('active'); if ($(this).next().is(':hidden')) $(this).next().slideToggle().parent().addClass('active'); });
});
我的页面上也有一个div
<div id="shortinfo">short info</div>
我如何在点击链接时将简短信息设置为 didssapear,并在再次点击时重新出现?
我尝试添加
<h1 onclick="document.getElementById('shortinfo').style.display='none'">
但是我需要它在再次点击后重新出现吗?
这是我的新代码,似乎不适用于他的切换
$(document).ready(function() {
$('.accordion ul li h1').click(function() { $(this).parent().parent().find('.ac:visible').slideToggle().parent().removeClass('active'); if ($(this).next().is(':hidden')) $(this).next().slideToggle().parent().addClass('active'); });
$('#shortinfo').toggle();
});
最佳答案
在使用 JQuery 时,可以使用 Toggle 方法来显示或隐藏元素:http://api.jquery.com/toggle/
然后您可以执行以下操作:
$('#shortinfo').toggle();
要将其与您的 h1 onclick 集成,它将变为:
<h1 onclick="$('#shortinfo').toggle()">
关于javascript - 基于javascript切换div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7335759/