Question

当单击下拉菜单中的选项卡时，将关闭，然后再次单击下拉菜单时，选项卡将更改。使用WordPress，波尔图主题。代码是波纹管的。怎么了？

<div class="dropdown messages-menu">
  
  <a  href="#" class="dropdown-toggle" data-toggle="dropdown">
    <span class="tmarketst"><i  class="porto-icon-user-2" ></i></span>  My Profile
  </a>
  <div class="dropdown-menu">
    <ul class="nav nav-tabs" id="myTab">
      <li class="active"><a data-target="#home" data-toggle="tab">Log in </a></li>
      <li><a data-target="#profile" data-toggle="tab">Register</a></li>
      
    </ul>

    <div class="tab-content">
      <div class="tab-pane active" id="home"><?php echo do_shortcode("[wc_login_form_mmy]"); ?> </div>
      <div class="tab-pane" id="profile"><?php echo do_shortcode("[wc_reg_form_mmy]"); ?></div>
      
    </div>
  </div>
</div>

 $( document ).ready(function() {
$('.dropdown-menu li').on('click', function(event){
//The event won't be propagated to the document NODE and 
// therefore events delegated to document won't be fired
   event.stopPropagation();
 });

 $('.dropdown-menu li').on('click', function(event){
   //The event won't be propagated to the document NODE and 
   // therefore events delegated to document won't be fired
   event.stopPropagation();
 });
   
 $('.dropdown-menu > ul > li > a').on('click', function(event){
  event.stopPropagation();
  $(this).tab('show')
 });
});

Answer 1

即使我没有完全理解您的问题。这是一个有效的下拉列表：https://www.w3schools.com/css/tryit.asp?filename=trycss_dropdown_button

PS：我只会使用CSS ...（集成很多媒体查询）我可以向您展示一个响应式下拉列表，该下拉列表的工作原理是仅适合我的网站...

如果单击选项卡，则关闭下拉菜单

1 个答案: