使用材料设计lite错误确认密码验证

Question

我目前正在使用Google的材料设计lite创建一个网页，并且当密码不匹配时，我需要将确认密码文本框更改为无效所需的必要更改。因此如果密码不匹配，则会产生样式为mdl-textfield__error样式的错误。

我怎样才能达到这个使用MDL？

<tr> 
    <td> 
     <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label"> 
      <form:input path="password" type="password" class="mdl-textfield__input" id="password" required="true" pattern="" /> 
      <label class="mdl-textfield__label" for="email">Password</label> 
      <span class="mdl-textfield__error"> Input must not be empty</span> 
     </div> 
    </td> 
</tr> 
<tr> 
    <td> 
     <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label"> 
      <input path="password" type="password" class="mdl-textfield__input" id="password" required pattern="" /> 
      <label class="mdl-textfield__label" for="email">Confirm Password</label> 
      <span class="mdl-textfield__error"> Input must be equal to password</span> 
     </div> 
    </td> 
</tr> 

Answer 1

如果你的问题是关于如何动态地应用样式，给两个密码字段不同的ID说密码1和passoword2和使用下面的代码jQuery中给予的造型。

$("#password2").parent().addClass('is-invalid'); 

此外，删除无效样式将涉及使用removeClass函数。

我从b2550的评论中得到了这个想法的想法https://github.com/google/material-design-lite/issues/1502