提交带有占位符的表单，颜色不从第一次单击jQuery开始触发

所以我有一个表格，它给了我两个问题。

一,。当我单击一次submit按钮时，会触发验证消息（良好），但占位符的文本颜色不会发生应有的变化，如果我单击两次，它会发生完美的变化。我需要在第一次更改它，只要有错误，它就应该更改。

二,。假设您为名称输入了任何值，例如字母e，然后点击提交两次，占位符文本将覆盖键入的内容。我需要在文本上不显示占位符，因为那里有一个值

这是我的小提琴

---

知道如何解决这个问题吗？

问题可能是每个“输入”都有两个“标签”元素。尽管官方的HTML规范允许这样做，但用户代理显示这种情况存在一些问题。看一看

---

尝试将其中一个标签替换为span或div。

问题在于您正在侦听单击事件，而应该侦听提交事件

更改此项：

$('#submit-ticket').click(function() {
if($('input').hasClass('error')) {
$("label.overlabel-apply").css('cssText', 'color: red !important');
}
});

为此：

$('#ticket-form').submit(function() {
    if($('input').hasClass('error')) {
        $("label.overlabel-apply").css('cssText', 'color: red !important');
    }
    $('input').each(function(){
        if($(this).val().length){
            hideLabel($(this).attr('id'), true);
        }
    });
});

---

.

谢谢，这解决了问题的第一部分。知道如何修复第二部分吗？谢谢谢夫，很有魅力。你介意解释第二个if条件以便我更好地理解它吗？@Maverick:

hideLabel（）

是

overlabels.js

中的一个函数。我放置了一个if语句以查看字段是否有值，如果有，则悬停在该字段上的标签将被该文件上的函数隐藏。