Question

我正在尝试使用Materialize和HTML5输入验证来显示自定义错误验证消息。检测到错误（显示invalid伪类），但不显示验证错误消息。

Materialise中的这个示例工作正常（如果设置了data-error属性，框架应该处理自定义错误）：

      <div class="input-field col s12">
        <input id="email" type="email" class="validate">
        <label for="email" data-error="wrong" data-success="right">Email</label>
      </div>

但不是我的一个领域：

 <div class="input-field col s12 m6">
      <input id="firstname" 
             type="text" 
             min-length="2"
             max-length="25" 
             pattern="^[a-zA-Z]+$" 
             class="validate" 
             required autofocus><br>
      <label for="firstname" 
             data-error="{{_ 'user_register_error_bad_firstname'}}" 
             data-success="ok">{{_ "first_name"}}</label>
  </div>

基本上，我希望字段值匹配正则表达式模式，在这种情况下只需要字母。

我认为我滥用了验证数据属性，但我不明白。或者Materialise不能处理基于模式的错误？有什么想法吗？

请注意，{{_ 'something'}}语法只是一个SpaceBar i18n帮助程序调用。

Answer 1

圣牛，这一切都发生了，因为我的输入和我的标签之间丢失了<br> ......

HTML5输入验证的自定义错误

1 个答案: