自定义HTML中无效字段的文本

Customize text for invalid fields in HTML

本文关键字：文本 字段 无效 HTML 自定义      更新时间：2023-09-26

我试图在输入的文本与模式不匹配时显示自定义消息。以下是我使用的代码:

<input pattern="[a-zA-Z0-9]" name="firstName" id="firstname" required="" type="text" />

当我输入一个有效的文本，如'akshay';它向我显示无效的消息:

'请匹配请求的格式'

另外，我想将此消息更改为自定义消息。我尝试使用上面给出的代码，但它不工作。下面是我使用的代码:

<script>
document.getElementById("firstname").addEventListener("invalid", function (e) {
var elem = e.target;
if (elem.value != "") {
    e.target.setCustomValidity('Cannot contain special characters');
}
});
</script>

尝试在输入标签

中使用无效的方法
<input pattern="[a-zA-Z0-9]*" name="firstName" id="firstname" required="required"
type="text" oninvalid="oninvalid="this.setCustomValidity(this.willValidate?'':'Cannot contain special characters')" />
相关文章：