我想要做的是在不同的div之间切换.这有点难以解释,但我会试一试.
当页面加载时,会有div可见,4有display:none.还有一个菜单.链接1将显示第一个div并隐藏所有其他div.然后当单击链接2时,可见的div将隐藏,div2将显示.单击链接3时,可见的div将隐藏,div3将显示,依此类推.基本上一次只显示一个div.
我写了这个,但只有当有2个div时它才有效.
$(function () {
$('#link').click(function () {
$('#div1, #div2').toggle();
});
});
Run Code Online (Sandbox Code Playgroud)
但这只会显示隐藏的div并隐藏显示的那个.
好的,我做到了,发现它可以更轻松地完成.这就是我所做的.它不是很优雅,但它的工作原理.
$(document).ready(function () {
$('.slidingDiv').hide();
$('.show_hide').show();
$('.show_hide').click(function () {
$('.slidingDiv').slideToggle();
$('.slidingDiv2').hide('slow');
$('.slidingDiv3').hide('slow');
$('.slidingDiv4').hide('slow');
$('.slidingDiv5').hide('slow');
});
});
$(document).ready(function () {
$('.slidingDiv2').hide();
$('.show_hide2').show();
$('.show_hide2').click(function () {
$('.slidingDiv2').slideToggle();
$('.slidingDiv').hide('slow');
$('.slidingDiv3').hide('slow');
$('.slidingDiv4').hide('slow');
$('.slidingDiv5').hide('slow');
});
});
$(document).ready(function () {
$('.slidingDiv3').hide();
$('.show_hide3').show();
$('.show_hide3').click(function () {
$('.slidingDiv3').slideToggle();
$('.slidingDiv').hide('slow');
$('.slidingDiv2').hide('slow');
$('.slidingDiv4').hide('slow');
$('.slidingDiv5').hide('slow');
});
});
$(document).ready(function () {
$('.slidingDiv4').hide();
$('.show_hide4').show();
$('.show_hide4').click(function () {
$('.slidingDiv4').slideToggle();
$('.slidingDiv').hide('slow');
$('.slidingDiv2').hide('slow');
$('.slidingDiv3').hide('slow');
$('.slidingDiv5').hide('slow');
});
});
$(document).ready(function(){
$('.slidingDiv5').hide();
$('.show_hide5').show();
$('.show_hide5').click(function () …Run Code Online (Sandbox Code Playgroud) 当有人抓住我的博客帖子的标题时,我正在尝试添加"阅读更多"文本.我尝试使用
$(".blogpost").mouseover(function(){
$(this).append(" - read more...");
});
但我不知道如何删除阅读更多...当onmouseout.