Question

我在另一个网站的导航栏中添加了一个下拉列表，并将类.open添加到列表中。我的意图如下：加载后，网页导航栏列表包含一个img元素，并打开显示促销优惠。到目前为止一切顺利，页面加载，列表显示广告，如果点击它然后关闭。

好的我的目标是通过jquery或JavaScript或css添加一个函数，它将在大约5秒后自动关闭下拉列表。我已经读过默认情况下不会清除bootstraps.min.css中的.open类，因此除非“点击”关闭它，否则它将保持打开状态。

 <div class="navbar-responsive">
   <ul class="nav navbar-nav">
   <li class="active">
     <li class="open dropdown-menu">
      <a href="#" Id="test" class="dropdown-toggle" data-               toggle="dropdown"><strong class="caret">

  <ul class="dropdown-menu">
     <li>
         <a href="#">Click to close.</a>
      </li>

           <li>
             <img src="image folder/my_ad_image.png" 
            </li>
           </ul>
        </li>
     </li>
   </ul>
     </div><!---end nav collapse--->
    </div><!---end container--->
   </div>>!---end main navbar--->

以上就是我所写的。它位于现有导航栏的顶部。谢谢你的阅读。

如果有人有任何建议或者可以指出我正确的方向关于将jquery超时函数绑定到我的.open类或id会很棒。到目前为止，我一直无法将jquery函数或css绑定到我的下拉列表中感谢。

Answer 1

您可以使用setTimeout()在javascript中实现计时器。

setTimeout()方法调用函数或计算表达式在指定的毫秒数之后。

调整代码可以像这样实现：

CSS：

...
<li id="myid" class="open dropdown-menu">
    <a href="#" class="dropdown-toggle" data-toggle="dropdown"><strong class="caret"></strong></a>
    <ul class="dropdown-menu">
        <li>
            <a href="#">Click to close.</a>
        </li>

        <li> ... </li>
    </ul>
</li>
...

jScript（假设你正在使用jQuery）：

$(function() {
    setTimeout(function() {
        $("#myid").removeClass("open")
    }, 5000);
});

Navbar下拉列表自动打开并自动关闭？

1 个答案: