从文本字段中删除验证（Materialize CSS）

Question

如果我单击文本字段，它会变成红色或绿色（视情况而定）。有没有办法删除验证？我希望如果我点击一个按钮，一个特定的文本字段（不是全部）会变成“恢复正常”？有什么办法吗？感谢您的帮助。

Answer 1

在 Materialize CSS 中，当输入标签具有验证 class 时会发生验证，删除它并添加它会使验证功能可切换。此外，当输入无效时，它有 invalid class ，删除后会将文本字段转换回其正常状态这是一个例子：

var el = document.getElementById("email");

function toggleValidation() {
  el.classList.toggle("validate");
  if (!el.classList.contains("validate")) {
    el.classList.remove("invalid")
  }
}

<script src='https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.2/js/materialize.min.js'></script>
<link rel="stylesheet" href='https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.2/css/materialize.min.css' />
<div class="input-field">
  <input id="email" type="email" class="validate">
  <label for="email">Email</label>
  <span class="helper-text" data-error="wrong" data-success="right">Helper text</span>
</div>
<button onclick="toggleValidation()" class="btn btn-primary waves-effect">Toggle validation</button>

从文本字段中删除验证（Materialize CSS）

Remove validation from text field(Materialize CSS)

html

javascript

validation

materialize