Question

按照目前的情况，点击“链接”两次会将您重定向到一个页面，但无论何时单击它并使其周围，菜单下降或上升，CSS代码

a:active span {
    color:#bdbcae;
}

生效。我想要做的是使链接仅在您第二次单击它时改变颜色，从而导致您被重定向到页面。如果您只点击一次以便只有菜单下拉，我希望链接保持其默认颜色。

这是我在下面的函数中的代码，我正在考虑完成这个

 if ($(this).data('clicks')==2){
       $(this).data('clicks', 0); 
       window.open("accomplishments.html");
 }

我正在考虑在这个if语句中添加$(this).addClass("active")的内容，但这不起作用 - 然后在不是这种情况下使其$(this).removeClass("active")，但没有这很有效。请参阅下面的完整代码。

Here's my Bootply

HTML：

<div class="navbar navbar-inverse navbar-fixed-top">
            <div class="container">

                <button class="navbar-toggle" data-toggle="collapse" data-target=".navHeaderCollapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>

                <div class="collapse navbar-collapse navHeaderCollapse">

                    <ul class="nav navbar-nav navbar-right">                            
                        <li class="dropdown">   
                            <a href="page.html" class="dropdown-toggle" data-toggle="dropdown"><span>Link</span><b class="caret"></b></a>
                            <ul class="dropdown-menu">
                                <li><a href="#">1</a></li>
                                <li><a href="#">2</a></li>
                            </ul><!-- END: "dropdown-menu" -->      
                        </li><!-- END: "dropdown" -->

                    </ul><!-- END: "collapse navbar-collapse navHeaderCollapse" -->
                </div><!-- END: "container" -->
            </div><!-- END: "container" -->
        </div><!-- END: "navbar navbar-inverse navbar-fixed-top" -->

CSS：

a span {
    color:#ffffff;  
}
a:hover *.caret {
    color:#bdbcae;
}
a:active span {
    color:#bdbcae;
}
a:active *.caret {
    color:#bdbcae;
}

jQuery的：

$(document).on("click", "span", function() {
         if(typeof $(this).data('clicks') == 'undefined') {
             $(this).data('clicks', 1);
             }else {
             $(this).data('clicks', $(this).data('clicks')+1);
         }
         if ($(this).data('clicks')==2){
                 $(this).data('clicks', 0); 
                 window.open("page.html");
         }
     });

$(document).click(function(event) {

    if(!$(event.target).closest("span").length) {        
            $("span").data('clicks', 0);  
    }        
});

Answer 1

我认为使用“click”和“dblclick”事件会对您有所帮助，如果您要重定向用户，为什么还要设置特定的颜色？

Jquery双击事件：http://api.jquery.com/dblclick/

使用jQuery切换名为“a：active”的类时出现的问题

1 个答案: