[英]I can't get my javascript to toggle my login dropdown. Why is javascript not connecting to my html?
我检查并重新检查了我的脚本链接,但它未连接到html。 我一定在做错事,但看不到。
我正在尝试将javascript连接到“登录”按钮,以便它显示和隐藏登录表单。 '''
<script type="text/javascript" src="/js/script.js"></script>
function myFunction() { document.getElementsById("myDropdown").classList.toggle("show"); } window.onclick = function(event) { if (!event.target.matches('.dropbtn')) { var dropdowns = document.getElementsByClassName("dropdown_content"); var i; for (i = 0; i < dropdowns.lenth; i++) { var openDropdown = dropdowns[i]; if (openDropdown.classList.contains('show')) { openDropdown.classList.remove('show'); } } } }
<div id="login"> <ul class="login_signup"> <li class="dropdown"> <button onclick="myFunction()" class="dropbtn"> Log in <span>▼</span> </button> <div id="myDropdown" class="dropdown_content"> <form> <fieldset id="inputs"> <input id="username" type="email" name="Email" placeholder="Your email address" required> <input id="password" type="password" name="Password" placeholder="Password" required> </fieldset> <fieldset id="actions"> <input type="submit" id="submit" value="Log in"> <label><input type="checkbox" checked="checked"> Keep me signed in</label> </fieldset> </form> </div> </li> <li id="signup"> <a href="">Sign up</a> </li> </ul> </div>
我想将此js连接到html中的登录按钮。
该函数是getElementById()
而不在元S S,因为可以有与给定的ID只有一个元素
另外,如果要使用相对路径,则应从src="/js/script.js"
删除/ 。 /表示从Web服务器的根路径开始,没有它表示从当前所在的文件开始搜索文件。
function myFunction() { document.getElementById("myDropdown").classList.toggle("show"); } window.onclick = function(event) { if (!event.target.matches('.dropbtn')) { var dropdowns = document.getElementsByClassName("dropdown_content"); var i; for (i = 0; i < dropdowns.lenth; i++) { var openDropdown = dropdowns[i]; if (openDropdown.classList.contains('show')) { openDropdown.classList.remove('show'); } } } }
<style> .dropdown_content { display: none; } .show { display: inherit !important; } </style> <div id="login"> <ul class="login_signup"> <li class="dropdown"> <button onclick="myFunction()" class="dropbtn"> Log in <span>▼</span> </button> <div id="myDropdown" class="dropdown_content"> <form> <fieldset id="inputs"> <input id="username" type="email" name="Email" placeholder="Your email address" required> <input id="password" type="password" name="Password" placeholder="Password" required> </fieldset> <fieldset id="actions"> <input type="submit" id="submit" value="Log in"> <label><input type="checkbox" checked="checked"> Keep me signed in</label> </fieldset> </form> </div> </li> <li id="signup"> <a href="">Sign up</a> </li> </ul> </div>
您可以将javascript路径从src="/js/script.js"
更改为src="./js/script.js"
。
尝试
src="js/script.js"
要么
src="../js/script.js"
如果可以共享您的文件夹结构,我可以更新我的答案
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.