1

我在白色背景下有一个带有灰色边框的按钮，单击按钮时它将向下滑动菜单。

当用户点击按钮时，按钮底部边框变为白色并下拉菜单，如果用户从菜单中点击，按钮将向上滑动，按钮底部边框变为红色。

我试图单独解决按钮问题，如果人们在按钮显示白色底部边框时没有单击下拉菜单内部，而是再次单击按钮向上滑动，向上滑动后我想将按钮底部边框更改为灰色。

这是代码...

这所做的是当单击按钮时，它将按钮底部边框更改为透明和下拉菜单。

$(document).ready(function(){
            $(".dropdown dt a").click(function() {
                $(this).css('border-bottom', 'solid 1px transparent' );
                $(".dropdown dd #md").slideToggle();
                });

这所做的是，当单击按钮时，它将按钮底部边框更改为透明和向下滑动菜单，当单击菜单内部的选项之一时，它将向上滑动并将底部边框按钮更改为蓝色。

$(".dropdown dd ul li a").click(function() {

          var text = $(this).html();
          $(".dropdown dt a span").html(text);
          $(".dropdown dd #md").slideUp();
    $('.dropdown dt a').css('border-bottom', 'solid 1px blue' );
          });

这样做是当单击按钮时，它将按钮底部边框更改为透明和向下滑动菜单，当单击菜单区域外部的选项之一时，它将向上滑动并将底部边框按钮更改为蓝色。

$(document).bind('click', function(e) {

          var $clicked = $(e.target);
          if (! $clicked.parents().hasClass("dropdown"))
          $(".dropdown dd #md").slideUp();    
     $('.dropdown dt a').css('border-bottom', 'solid 1px blue' );

          });

如果人们再次从按钮单击到滑动菜单并将底部边框底部更改为灰色，是否有人可以帮助我如何编写代码！

谢谢。

4

2 回答 2

0

http://api.jquery.com/slideToggle/

http://api.jquery.com/toggleClass/

CSS

.active{
    border-bottom:solid 1px blue;
}

js

$(document).bind('click', function (e) {
    var $clicked = $(e.target);
    if (!$clicked.parents().hasClass("dropdown")) $(".dropdown dd #md").slideToggle();
    $('.dropdown dt a').toggleClass('active');
});
于 2013-08-29T04:44:40.120 回答
0

使用类来实现这一点。使用 css 并附加颜色和边框等属性。即时添加和删除类。在我看来，这会更容易。

于 2013-08-29T04:46:25.767 回答