用户错误消息 |HTML 数据与 JavaScript

User Error Messages | HTML data vs JavaScript

本文关键字：数据 JavaScript HTML 错误 消息 用户      更新时间：2023-09-26

我在下面有这个对象：

我想过像这样将消息放在 html 中

<div id = "text_identifier">text_here</div> // div is hidden.

然后使用 getElementById 将消息拉入 JavaScript 并最终以正确的元素（Message 中的参数元素）显示给用户

两个相关的问题？

在 JavaScript 中拥有这样的内容是一种不好的做法吗？

如果我确实将消息移动到 HTML 中，我上面描述的方法是否是最佳实践？

/**
 *Message
 */
var Message = function( element )
{
    var messages =  
    {
        name:         'Please enter a valid name',
        email:        'Please enter a valid email',
        pass:         'Please enter passoword, 6-40 characters',
        url:          'Please enter a valid url',
        title:        'Please enter a valid title',
        tweet:        'Please enter a valid tweet',
        empty:        'Please complete all fields',
        email_s:      'Please enter a valid email.',
        same:         'Please make emails equal',
        taken:        'Sorry, that email is taken',
        validate:     'Please contact <a class="d" href="mailto:guy@host.com">support</a> to reset your password',
    }
    this.display = function( type ) 
    {
        element.innerHTML = messages[ type ];
        new Effects().fade( element, 'down', 4000 );
    }
};

这取决于你喜欢怎么做。通常JavaScript不是重要的东西，它是php后端部分。因此，将其集成到您的系统中易于阅读的方式。:)

我会为每个元素使用 HTML data-* 属性。

如果你有很多输入，你可以这样做：

<input type="text" name="name" data-error-message="Please enter a valid name">
<input type="text" name="email" data-error-message="Please enter a valid email">
<input type="text" name="pass" data-error-message="Please enter passoword, 6-40 character">
选择

值时，还可以选择错误消息:)

我相信您知道如何根据您到目前为止所说的使用 javascript，在实践中您使用的方法绝对没问题，应该不会对您造成任何伤害，我添加了一个链接，以防您需要参考

http://www.javascripttoolbox.com/bestpractices/

我认为这确实是一个偏好问题。你可以把它放在HTML中，只显示一个带有特定类的div（即一个说"对不起，那封电子邮件被拿走了"的div有类.taken，当该错误触发时，你会显示那个div）。

可能会

有关于性能的争论，但我认为它们在这个规模上是微不足道的，如果有的话，你的方法可能会稍微好一点。它为您提供了一个统一的位置来编辑消息，以及将这些消息调用到前面的简单干净的方式。

所以真的，一个意见/偏好的问题。

相关文章：