按下登录按钮时如何编辑输入提示[重复]

Question

我想在按下登录按钮时编辑此提示，

input:valid

是

false

.

我该如何编辑它？

我也想禁用这个

body {
  background-color: #202020;
  color: #ffffff;
  font-size: 16px;
}

input {
  width: 40%;
  color:red;
  background-color: rgba(90,10,110,0.6);
  border-radius:16px;
  border:none;
  border-bottom:3px solid red;
  height: 45px;
  padding: 6px 10px 5px 10px;
}

input:focus {
  outline:none;
}

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Test</title>
  <link rel="shortcut icon" type="image/x-icon" href="img/favicon.svg">
  <!-- reset.css -->
  <link rel="stylesheet" href="libraries/reset/reset.css">
  <!-- css js -->
  <link rel="stylesheet" type="text/css" href="css/main.css">
  <script defer src="js/script.js"></script>
</head>

<body>



  <main>


    <form>
      <div class="input">
        <input type="password" required>
      </div>
      <button>Login</button>
    </form>




  </main>


</body>
</html>

我尝试设置

required="123"

和

aria-describedby="first-name-error"

，但没有达到效果。

我还尝试改编this文章中的代码，但没有帮助。（我想我做错了什么）

Answer 1

.setCustomValidity()

和

.reportValidity()

可能对你有用。然而，前者只允许您修改消息的内容。

试试看：

const input = document.querySelector('input');

input.setCustomValidity('Foobar');

input.addEventListener('keydown', function() {
  console.log(this.reportValidity());
});

<input type="text">

按下登录按钮时如何编辑输入提示[重复]

问题描述投票：0回答：1

1个回答

最新问题

按下登录按钮时如何编辑输入提示[重复]

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1