javascript - 突出显示表单输入之间的文本？

Question

我有一个表单，当用户提交它时，它会由 js 进行验证。我的代码检测到空字段和无效字段(例如电话号码中的 1 个号码显然是无效的电话号码)。

系统询问我是否可以突出显示缺失或错误的字段。我想如果我能自动完成的话那就太酷了。使用如下所示的 HTML，我怎样才能使姓名、电话或其他任何内容变成红色？我想不出任何解决办法。也许我可以从表单中提取 html 正文，找到目标输入，然后在输入左侧插入一个 div 到 prev 标签，并使用该 div 将字体设为红色。但我讨厌这个想法，因为这需要戳 HTML 而不是 DOM，而且我很确定会发生一些令人讨厌的事情。有什么想法吗？

Name: <input type=text name="Name"/>
Phone: <input type=text name="PhoneNo"/>

Answer 1

将 HTML 更改为 <label>围绕“姓名”和“电话”，这将使其更易于访问并提供您正在寻找的功能。

HTML

<label for='Name'>Name:</label> <input type=text name="Name"/>
<label for='PhoneNo'>Phone:</label> <input type=text name="PhoneNo"/>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

jQuery

​$('input').blur(function() {
    $('label[for="'+$(this).attr('name')+'"]').css('color','red');
});​​​​

实例

http://jsfiddle.net/tve8J/

您当然必须添加验证，我不知道您考虑什么以及“无效字段”