[英]How can i make a input type submit button that will just can used after filling up the form
我在网站上制作了一个表格，但是当我点击提交按钮而不填写表格时。我要去那里。 我只想当我完全填写表格时，然后我会 go 那里。 使用输入，键入提交按钮。 我的代码是：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Form</title>
</head>
<body>
<input placeholder="First Name" type="text"> <br>
<input placeholder="Last Name" type="text"> <br>
<input placeholder="Email Adrress" type="text"> <br>
<input placeholder="Password" type="password"> <br>
<input placeholder="Confirm Password" type="password"> <br>
<input style="cursor: pointer;" name="Gender" type="radio">Male <input style="cursor: pointer;" name="Gender" type="radio">Female <br> Birthday
<select style="cursor: pointer;">
<option>Select Date</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>13</option>
<option>14</option>
<option>15</option>
<option>16</option>
<option>17</option>
<option>18</option>
<option>19</option>
<option>20</option>
<option>21</option>
<option>22</option>
<option>23</option>
<option>24</option>
<option>25</option>
<option>26</option>
<option>27</option>
<option>28</option>
<option>29</option>
<option>30</option>
<option>31</option>
</select> <br>
<a href="file:///C:/Users/Guest/Desktop/Html/Website/Home.html"><input type="submit"></a>
</body>
</html>
首先，您必须在后台检查表单验证，这将对您有所帮助（ https://www.sitepoint.com/instant-validation/ ）
然后，您必须将您的提交按钮放在一个 div 中并为该 div 提供一个选择器，并在 javascript 检查您的表单是否无效，然后将该 div 显示为“无”，但如果您的表单有效，则将该显示为“堵塞”
这段代码会让你：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Form</title>
</head>
<body>
<input placeholder="First Name" type="text"> <br>
<input placeholder="Last Name" type="text"> <br>
<input placeholder="Email Adrress" type="text"> <br>
<input placeholder="Password" type="password"> <br>
<input placeholder="Confirm Password" type="password"> <br>
<input style="cursor: pointer;" name="Gender" type="radio">Male <input style="cursor: pointer;" name="Gender" type="radio">Female <br> Birthday
<select style="cursor: pointer;">
<option>Select Date</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>13</option>
<option>14</option>
<option>15</option>
<option>16</option>
<option>17</option>
<option>18</option>
<option>19</option>
<option>20</option>
<option>21</option>
<option>22</option>
<option>23</option>
<option>24</option>
<option>25</option>
<option>26</option>
<option>27</option>
<option>28</option>
<option>29</option>
<option>30</option>
<option>31</option>
</select> <br>
<div id="submit">
<a href="file:///C:/Users/Guest/Desktop/Html/Website/Home.html"><input type="submit"></a>
</div>
</body>
<script>
document.getElementById('submit').style.display = "none";
//Check formIsValid or not in background
//if your form is valid then only the submit button will appear
if(formIsValid){
document.getElementById('submit').style.display = "block";
}
</script>
</html>
首先，您的输入元素不在表单标签内。 为了拥有这样的表格，至少您的一个或多个表格元素必须如下所示：
<form>
<input placeholder="First Name" type="text" required> <br>
<input placeholder="Last Name" type="text" > <br>
<input placeholder="Email Adrress" type="text"> <br>
<input placeholder="Password" type="password" required> <br>
<input placeholder="Confirm Password" type="password"> <br>
<input style="cursor: pointer;" name="Gender" type="radio">Male <input style="cursor: pointer;" name="Gender" type="radio">Female <br> Birthday
</form>
如您所见，我输入了所需的名字和密码，所以现在如果我们单击提交按钮，它会告诉我们填写所需的输入。 另一方面，通常需要至少一个或多个 forms 元件。 因此，请尝试至少要求您提供一项或多项输入。 希望能帮到你！ 祝你好运！
使用“共享”按钮（而不是“提交”类型的输入元素）时，如何使表单验证起作用？
[英]How can I get Form Validation to work when using a “shared” button (instead of an input element of type “submit”)?
当我使用JavaScript在表单中输入错误的类型信息时，如何停止表单提交？
[英]How can I stop the form submit when I input wrong type info in the form using javascript?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.