个人中心
gpt4 book ai didi

javascript - sidenav 关闭时按钮不起作用

转载 作者：太空宇宙 更新时间：2023-11-04 09:44:48 26 4
gpt4 key购买 nike

由于某些原因，我正在我的网站按钮上的登录页面上工作，当 sidenav 退出时提交按钮不可点击(我正在使用物化框架)。

我对我的 sidenav 做了一些修改，这样当覆盖层出来时它就会被移除，并且在它外面单击时它不会关闭。

$('.button-collapse').sideNav({
          menuWidth: 260, 
          edge: 'left', 
          closeOnClick: true 
        }
      );
      
      
      //Unbind sidenav click to close 
      $(function(){
        
    
        $(".drag-target").unbind('click');
        $("#sidenav-overlay").unbind('click');
    });
html,body {
    	height: 100%;
    	background-color:
    }
    
    header, main, footer, header{
        padding-left: 0 auto;
    }
    
    @media only screen and (max-width : 992px) {
    	header, main, footer {
            padding-left: 0;
        }
    }
    
    .rotate90 {
    	-ms-transform: rotate(-90deg); 
        -webkit-transform: rotate(-90deg); 
        transform: rotate(-90deg);
    } 
    
    
    .text1 {
    	color: #212121;
    }
    
    .text2 {
    	color: #757575;
    }
    
    nav.top-nav {
    	background-color: #303F9F;
    }
    
    .title-text {
    	font-family: Roboto;
    	font-weight: bold;
    }
    
    a.bold, .bold {
    	font-family: Roboto;
    	font-weight: bold;
    }
    
    a.light, .light {
    	font-family: Roboto;
    	font-weight: normal;
    }
    
    #sidenav-overlay {
    	display: none;
    }



    
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
          <header>
             <nav class="top-nav">
                <div class="container">
                   <a href="#" data-activates="slide-out" class="button-collapse show-on-large"><i class="material-icons">menu</i></a>
                   <div class="navbar-wrapper">
                      <a href="/index.html" class="brand-logo center">Icy Fire</a>
                   </div>
                </div>
             </nav>
             <ul id="slide-out" class="side-nav">
                <h4 class="title-text center-align">Navigation</h4>
                <div class="divider"></div>
                <li><a href="/user/account.php" class="waves-effect waves-teal bold">Account</a></li>
                <li class="no-padding">
                   <ul class="collapsible collapsible-accordion">
                      <li>
                         <a class="collapsible-header waves-effect waves-teal bold">Pages<i class="material-icons">arrow_drop_down</i></a>
                         <div class="collapsible-body">
                            <a href="/index.html" class="active waves-effect light">Index</a>
                         </div>
                      </li>
                   </ul>
             </ul>
          </header>
    	  
          <main>
             <div class="container">
                <div class="row">
                   <div class="col s12">
                      <h2 class="indigo-text">Login</h2>
                      <div class="divider"></div>
    				  
                      <form class="col s12" action="login.php" method="POST">
                         <div class="input-field">
                            <input id="username" type="text" class="validate" name="username" required>
                            <label for="username">Username</label>
                         </div>
                         <div class="input-field">
                            <input id="password" type="password" class="validate" name="password" required>
                            <label for="password">Password</label>
                         </div>
                         <div class="input-field">
                            <input type="checkbox" id="indeterminate-checkbox" name="remember" value="on" />
                            <label for="indeterminate-checkbox">Remember me</label>
                         </div>
    					 
                         <button class="btn waves-effect waves-light blue right" type="submit" name="action">Submit
    						<i class="material-icons right">send</i>
    					</button>
    					
                      </form>
    				  <h5 class="indigo-text"><?php getMsg(); ?></h5>
                   </div>
                </div>
             </div>
          </main>
          <footer>
          </footer>
       </body>

在我的网站上:link

最佳答案

你有一个 <div class="drag-target">这与菜单一起显示。这覆盖了您的整个表单。您可以通过右键单击提交按钮顶部并单击 Inspect Element 来亲自查看。在下拉菜单中。

enter image description here

关于javascript - sidenav 关闭时按钮不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39564458/

26 4 0
文章推荐： java - 为什么Java中可以抛出null？
文章推荐： java - 如何为包含 Errors/BindingResult 的 Controller 编写测试？
文章推荐： linux - 什么是 `top` 指的是无交换机器上的虚拟内存
文章推荐： java - 为什么我总是在 View.OnClickListener 中看到最后一个 id？
太空宇宙
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com