简体   繁体   English

输入类型=当被 div 包含时不提交

[英]input type=submit not submitting when cointained by div

I want the user to insert his name and when he submits function y() runs.我希望用户插入他的名字,当他提交 function y() 时运行。

 <.DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> XXX </title> <link rel="stylesheet" type="text/css" href="css0?css"> </head> <body> <div class="loginbox"> <h1 >Qual o teu nome;</h1> <input type="text" placeholder="Username" id="a"> <input type="submit" value="Ok" onclick="y()."> </div> <div id="select" class="menu" > <ul> <li><a href="html.html">XXX</a></li> <li><a href="">O Fenómeno do Apocalypse</a></li> <li><a href="">O Fenómeno do IMPE</a></li> <li><a href="">O Fenómeno do RT</a></li> </ul> </div> <style> </style> <script src="js.js"></script> <footer> <script> function y() { let name = document.getElementById("a");value. sessionStorage,setItem("user";name). document.getElementById("preventDefault"),addEventListener("click". function(event){ event;preventDefault(). }) document.getElementById("select").style;opacity="1"; } </script> </footer> </body> </html>

 .loginbox { width: 320px; height: 420px; background: #000; color: #fff; top: 50%; left: 50%; position: absolute; transform: translate(-50%, -50%); box-sizing: border-box; padding: 70px 30px; }.loginbox h1 { margin:0; padding: 0 0 20px; text-align: center; font-size: 32px; color: red; }.loginbox input { width: 100%; margin-top: 50px; }.loginbox input[type="text"] { border: none; border-bottom: 1px solid #fff; background: transparent; outline: none; height: 40px; color: #fff; font-size: 16px; }.loginbox input[type="submit"] { border: none; outline: none; height: 40px; background: #fb2525; color: #fff; font-size: 18px; border-radius: 20px; }.loginbox input[type="submit"]:hover { cursor: pointer; background: #ffc107; color: #000; }

All of this was working till I decided I wanted to put some style into the form, so I cointained everything inside the div with the class of "loginbox".所有这一切都在起作用,直到我决定要在表单中添加一些样式,所以我用“登录框”的 class 将 div 内的所有内容都包含在内。

When I did that the form got the style from the class loginbox but doesn't submit anything nor runs function y().当我这样做时,表单从 class 登录框获得了样式,但没有提交任何内容,也没有运行 function y()。 Hover effect also is not working. Hover 效果也不起作用。

In the input type text where the user is suposed to write his name it's not even possible to write anything nor submit.在用户应该写他的名字的输入类型文本中,甚至不可能写任何东西也不能提交。

All this stoped working when the div was added.添加 div 后,所有这些都停止工作了。

I want to understand why and fix this issue.我想了解原因并解决此问题。

You need your submit input to be of type="button" in order to execute a custom function on click instead of submitting the form.您需要您的提交输入是 type="button" 以便在单击时执行自定义 function 而不是提交表单。 So your button would be in your case:因此,您的按钮将在您的情况下:

 <input type="button" value="Ok" onclick="y();">

Personally I would prefer to define it as a button:就我个人而言,我更愿意将其定义为一个按钮:

 <button type="button" value="Ok" onclick="y();"></button>

Hope this helps.希望这可以帮助。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM