个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
24
4
我有 3 个简单的按钮，3 个简单的 div。我需要这些 div 根据按钮点击在彼此之间切换。这很好用。
问题:在第一页加载后，最后一个 div(示例文本 3)可见，而不是第一个(示例文本 1)。只有第一个 div 设置为显示: block 。其余设置为显示:无。
javascript:
<script type="text/javascript">
$(window).load(function() {
$(document).ready(function() {
$('.content-switch').hide().eq($('.buttons a.active').index()).fadeIn("slow");
});
$('.buttons a').click(function() {
$(".content-switch").eq($(this).index()).fadeIn("slow")
.siblings('.content-switch').fadeOut("fast");
});
});
</script>
html:
<body>
<div class="buttons">
<a href="#" id="button1">Button 1</a>
<a href="#" id="button2">Button 2</a>
<a href="#" id="button2">Button 3</a>
</div>
<div class="buts" id="buts">
<div style="display: block;position:absolute" class="content-switch" id="but1">
<p>sample text 1</p>
</div>
<div style="display: none;position:absolute" class="content-switch" id="but2">
<p>sample text 2</p>
</div>
<div style="display: none;position:absolute" class="content-switch" id="but2">
<p>sample text 3</p>
</div>
</div>
</body>
最佳答案
改变:
.eq($('.buttons a.active').index())
到:
.eq(0)
所以你有:
$('.content-switch').hide().eq(0).fadeIn("slow");
$('.buttons a').click(function () {
$(".content-switch").eq($(this).index()).fadeIn("slow")
.siblings('.content-switch').fadeOut("fast");
});
$('.buttons a.active').index() 返回 -1 因为没有 .buttons a.active元素，这就是第三个 div 显示的原因。
另一种解决方案是在第一个 anchor 上放置一个事件类并使用您的原始代码:
<a href="#" id="button1" class="active">Button 1</a>
关于jquery 显示 :block not working correclty when more than 2 divs，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19684149/
24
4
0
我目前正在尝试使用 WPF。我使用 Windows Template Studio for Visual Studio 创建了一个演示项目。 现在我想添加一个应该由 MVVM 模式自动保存的文本框。我
我对我的项目印象深刻，但突然我注意到我做的事情非常错误，因为每次创建、合并、删除都是我手动执行的，但我应该让 JPA 为我处理这些事情，对吧？ 我所做的是创建数据库，然后从中创建实体。所以here i
我有 3 个简单的按钮，3 个简单的 div。我需要这些 div 根据按钮点击在彼此之间切换。这很好用。 问题:在第一页加载后，最后一个 div(示例文本 3)可见，而不是第一个(示例文本 1)。只有
我是一名优秀的程序员,十分优秀！