jQuery 问题 - 如何仅用一个按钮执行两个操作

Question

我目前有两个按钮。第一个按钮显示一个 div。第二个按钮显示第二个 div。

这里是 codepen 的链接

...这是我当前的 jQuery...

$(function(){
  $('#first').click(function () {
      $('.val').delay(500).slideDown(); 
  });

 $('#second').click(function () {
$('.val2').prependTo('.applied').delay(500).slideDown(400, function(){
        $('.total').html('£104.00');
      });
  });
});

我想做的是仅用一个按钮显示两个 div。因此用户会选择按钮来显示第一个 div。然后，当他们再次按下同一按钮时，它将显示第二个 div。我想我可能需要使用“if 语句”来表示当前是否显示，然后显示第二个，但我的代码似乎不正确。

Answer 1

如果您将某些内容设置为“向下滑动”，则更改其可见性属性:)

if ($('.second').is(':visible'))
{
     //show first
}
else
{
   //show second
}

第二次点击后，两者都会可见:)在您的情况下:

$('#first').click(function () {

    if($('.val2').is(':visible'))
         $('.val').delay(500).slideDown(); 
    else    
        $('.val2').prependTo('.applied').delay(500).slideDown(400, 
           function(){
                $('.total').html('£104.00');
           });   

});