具体化最佳实践验证空场

cir*_*iro 6 html validation html5 materialize material-design

我用这个表格

<div class="row">
    <form class="col s12">
        <div class="row">
            <div class="input-field col s12">
                <input id="email2" type="email" class="validate">
                <label for="email2" data-error="wrong" data-success="right">Email</label>
            </div>
            <div class="input-field col s12">
                <input id="example" name="example" type="text" class="validate" required="" aria-required="true">
                <label for="example" data-error="wrong" data-success="right">Field</label>
            </div>
        </div>
    </form>
</div>
Run Code Online (Sandbox Code Playgroud)

邮件领域还可以.如果我在不正确的邮件地址发布错误消息出现.

示例字段不起作用.我会检查字段是否为空,然后显示错误.

怎么了?

小智 16

您忘了添加required="",aria-required="true" 这里是完整的代码段:

<div class="row">
    <form class="col s12">
        <div class="row">
            <div class="input-field col s12">
                <input id="email2" type="email" class="validate" required="" aria-required="true">
                <label for="email2" data-error="wrong" data-success="right">Email</label>
            </div>
            <div class="input-field col s12">
                <input id="example" name="example" type="text" class="validate" required="" aria-required="true">
                <label for="example" data-error="wrong" data-success="right">Field</label>
            </div>
            <div class="input-field col s12">
                <button class="btn waves-effect waves-light" type="submit" name="action">Submit</button>
            </div>
        </div>
    </form>
</div>
Run Code Online (Sandbox Code Playgroud)

http://jsfiddle.net/u76rdq2h/