Question

我想使用两个不同的div 切换我的内容。如果我点击div打开“打开”这个打开的内容并关闭内容我点击单独的div与类“关闭”。

<div class="open"></div>
<div class="close"></div>

<div id="contents"></div>

我该如何做到这一点？

这是我的剧本：

$('.open').toggle(function(){
    $('#contents').hide();
    $('.wrapper').animate({'width':'200px'}).end().find('.content').animate({ 'right': '30px' }) 
}, 
function() {
    $('#contents').show();      
    $('.wrapper').animate({'width':'40px'}).end().find('.content').animate({ 'right': '0' })    
});

谢谢！

Answer 1

您可以将click事件处理程序绑定到单独的元素

$('div.open').click(function(){
   // your open code here
});
$('div.close').click(function(){
   // your close code here
});

Answer 2

将它们分成2个点击功能

$('.close').click(function(){
    $('#contents').hide();
    $('.wrapper').animate({'width':'200px'}).end().find('.content').animate({ 'right': '30px' }) 
});
$('.open').click(function() {
    $('#contents').show();      
    $('.wrapper').animate({'width':'40px'}).end().find('.content').animate({ 'right': '0' })    
});

Answer 3

$(".open").click(function() {
    $("#contents").show();
});

$(".close").click(function() {
    $("#contents").hide();
});

如何用多个div切换div内容？

3 个答案: