显示所有空白和必填字段的“请填写此字段” [英] Displaying 'Please fill out this field' for all empty and required fields

问题描述

是否可以让HTML / PHP页面显示默认的请填写此字段消息的多个实例？在 尝试提交 时，每个必填字段旁边/下方都是空的。使用JavaScript或jQuery的解决方案是首选。

Is it possible to have a HTML/PHP page display multiple instances of the default 'Please fill out this field' message? As in, right next to / underneath every required field which is empty on attempted submission. Solutions with JavaScript or jQuery are preferred.

输入元素已经具有必需属性，其中第一个未填充的元素伴随着默认值验证信息。

The input elements already have the required attribute, and the first of them which is unfilled is accompanied by the default validation message.

可以看到所需结果的示例在这里

Example of the desired outcome can be seen here

说实话，我觉得这没有任何意义，但我们的一位客户非常坚持这一要求。

To be perfectly honest, I find no sense in this, but one of our clients was pretty adamant with this request.

推荐答案

您需要为每个字段创建自己的JS验证并显示必要的响应。

You will need to create your own JS validation for every field and display the necessary response.

这是我测试一个字段是否为空的方法：

This is how I would test if a field is not empty:

function checkName(val){
        if(/^[^-\s][\w\s]+$/.test(val)){
            return true;
        }else{
            if(val.length != 0){
                return false;
            }
        }
    }

这篇关于显示所有空白和必填字段的“请填写此字段”的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！