首页 > 解决方案 > 如何创建自定义表单所需的错误文本而不在我的注册表单中添加多余的代码?

问题描述

所以我有所需的错误消息,显示在 html 中附加的输入 + id

  <div class="form-validation">
            <input class="modal-input" id="password" type="password" placeholder="Enter your 
   password">
            <p>Error Message</p>
        </div>
        <div class="form-validation">
            <input class="modal-input" id="password-confirm" type="password" placeholder="Confirm your password">
            <p>Error Message</p>
             </div>

如您所见,id 的密码相等,然后密码确认

现在的问题是我不知道如何创建自定义文本以将其从说密码确认更改为只说密码而不与 id 名称重叠。

下面是我的意思的图片

在此处输入图像描述

这是我为了显示“密码确认”而编写的函数

   function getFieldName(input) {
return input.id.charAt(0).toUpperCase() + input.id.slice(1);
   }

这是我的功能,确保必填字段显示错误消息,getFieldName 作为消息中的第一个单词

  function checkRequired(inputArr) {
inputArr.forEach(function (input) {
   if(input.value.trim() === '') {
       showError(input, `${getFieldName(input)} is required`);
   } else {
       showValid(input);
   }
});
  }

我试图只针对输入上的类型而不是 id,但我遇到了另一个问题,因为当我想让它说“用户名”时输入类型 =“文本”显示“需要文本”所以我需要一种方法能够创建任何自定义词+“是必需的”

所以基本上我可以自定义它说“需要什么”

标签: javascripthtmlcss

解决方案


将数据标记添加到您要定位的 html 元素。并使用它来显示您需要显示的任何内容。

有关详细信息,请参阅如何存储某些 HTML 标记的任意数据。


推荐阅读