如何使用“signup.js”等外部脚本检查两个字段的身份？

Question

我与电子合作。 我的项目中有三个文件。

索引.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" href="../css/styles.css">
        <script src="../js/preload.js"></script>
        <script src="../js/signup.js"></script>
    </head>
    <body>
        <form action="" onsubmit="return validate()">
            <label for="email"><b>Почта</b></label>
            <input type="text" placeholder="Введите почту..." name="email" required>
            <label for="psw"><b>Пароль</b></label>
            <input type="password" placeholder="Введите пароль..." id="psw" required>
            <label for="psw-repeat"><b>Подтверждение пароля</b></label>
            <input type="password" placeholder="Повторите пароль..." id="psw-repeat" required>
            <hr>
            <p id = "terms">Создавая аккаунт, вы соглашаетесь с нашими <a href="#">условиями пользования и приватности</a>.</p>
            <button type="submit" class = registerbtn>Зарегистрироваться</button>
        </form>      
    </body>
</html>

样式文件

@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway&display=swap');

body {
    font-family: 'Raleway', sans-serif;
}

.sign_up {
    padding: 16px;
}

input[type=text],
input[type=password] {
    width: 100%;
    padding: 15px;
    margin: 5px 0 22px 0;
    display: inline-block;
    border: none;
    background: #f1f1f1;
    font-family: 'Raleway', sans-serif;
}

hr 
{
    border: 1px solid #f1f1f1;
    margin-bottom: 25px;
}

.registerbtn {
    background-color: darkcyan;
    color: white;
    padding: 16px 20px;
    margin: 8px 0;
    border: none;
    cursor: pointer;
    width: 100%;
    opacity: 0.9;
}

.registerbtn:hover {
    opacity: 1;
}

a {
    color: dodgerblue;
}

#warning {
    color: crimson;  
}

注册.js

function validate()
{
    var password = document.getElementById(psw).value;
    var password_repeat = document.getElementById(psw-repeat).value
    if(password != password_repeat)
    {
       document.getElementById(psw).insertAdjacentHTML("afterend", "<p id = \"warning\">Пароли не совпадают!</p>")
    }
}

该项目本身是用俄语编写的。 我想使用文件 signup.js 来检查字段“psw”和“psw-repeat”的身份，但是当程序运行时，没有任何反应。 至于字段的内容，当点击按钮时它们会被清空。

Answer 1

onsubmit值应该只有方法调用，而不是“返回”。

所以，我建议你使用这样的东西：

onsubmit="validate()"

文档

此外，提交按钮有“类”css 问题，它应该是这样的：

<button type="submit" class="register btn">Зарегистрироваться</button>

如何使用“signup.js”等外部脚本检查两个字段的身份？

问题描述

1 个解决方案

解决方案1
0 2021-10-20 14:45:37

如何使用“signup.js”等外部脚本检查两个字段的身份？

问题描述

1 个解决方案

解决方案1 0 2021-10-20 14:45:37

解决方案1
0 2021-10-20 14:45:37