jquery关闭切换

我有多个按钮切换相同的div（实际上是我的页面上的iframe）。当我点击不同的按钮时，我希望他们'retoggle'，但是当我再次点击同一个按钮时，我只想关闭div。jquery关闭切换

$(document).ready(function(){ 
    $('.leftbutton').click(function(){ 
     if($('#left').is(':visible')) return ; // ignoring 
     $('#right').hide(); 
     $('#left').fadeIn(); 
    }); 
}); 

$(document).ready(function(){ 
    $('.rightbutton').click(function(){ 
     if($('#right').is(':visible')){ 
      $('#right').fadeOut(); 
      $('#right').fadeIn(); 
     } 
     else{ 
      $('#left').hide(); 
      $('#right').fadeIn(); 
     } 
    }); 
});

来源

2013-01-23 ThomasCS

你可以做的是保存过去的按钮被点击的目标元素的一部分。例如：

$(".rightbutton").on('click', function() { 
    $("#right").data('lastClicked', this);

然后，比较，最后点击与this数据看按钮是否应该显示与否。

http://jsfiddle.net/CfGYG/10/

来源

2013-01-23 03:18:33

你太棒了！我正在搞清楚remove和addclass，但是这样好多了！谢谢 – ThomasCS

要关闭后再次点击左边的，你可以简单地把它隐藏，而不是在你的函数返回。此相同的概念可以应用于右按钮：

$('.leftbutton').click(function(){ 
    if($('#left').is(':visible')) 
    { 
     $("#left").hide("slide");; 
     return; 
    } 
    $('#right').hide(); 
    $('#left').fadeIn(); 
});

http://jsfiddle.net/CfGYG/11/

来源

2013-01-23 03:19:34

这两个答案都是有用的，并结合它给了我所有我想要的功能。

看看这个的jsfiddle：http://jsfiddle.net/thomascs/nV5Tu/

$(document).ready(function(){ 
    $('.leftbutton').click(function(){ 
     if($('#left').is(':visible')) { 
      $('#left').hide(); 
     } 
     else { 
     $('#right').hide(); 
     $('#left').fadeIn(); 
     } 
    }); 
}); 

$(document).ready(function(){ 
    $('.rightbutton').click(function() { 
     if ($('#right').is(':visible')) { 
       $('#right').fadeOut(); 
      if ($("#right").data('lastClicked') !== this) { 
       $('#right').fadeIn(); 
      } 
     } 
     else { 
      $('#left').hide(); 
      $('#right').fadeIn(); 
     } 
     $("#right").data('lastClicked', this); 
    }); 
});

感谢您的帮助！

来源

2013-01-23 03:38:56 ThomasCS

jquery关闭切换

回答

相关问题