Question

在我的jQuery验证逻辑中，我有这个：

if (strippedPN.length !== 10) {
    $('#phoneNumber').after('<span color="red" id="errPhoneNumber">Phone number has to be 10 digits long.  </span>');
    proceed = false;
}

因为我希望字段旁边显示的错误消息为红色。它不起作用。怎么了？

注意：我尝试在css()之前使用after()，但它会更改字段内文本的颜色（正如预期的那样，顺便说一下）。我还在css()之后尝试了after()，但它也无效。还尝试了addClass。

这是HTML：

<div>
  <label for="phoneNumber" class="label">Phone Number</label>
  <input name="phoneNumber" type="text" id="phoneNumber" size="13">
</div>

Answer 1

给它一个风格..

<style>
#errPhoneNumber {color:red; }
</style>

然后应用它......

if (strippedPN.length !== 10) {
$('#phoneNumber').after('<span id="errPhoneNumber">Phone number has to be 10 digits long.      </span>');
proceed = false;
}

或者，如果您想要通常应用多个跨度/错误消息......一个类更好。

<style>
 .error {color:red;}
</style>

    if (strippedPN.length !== 10) {
$('#phoneNumber').after('<span class="error" id="errPhoneNumber">Phone number has to be 10 digits long.      </span>');
proceed = false;
}

Answer 2

你的意思是两个中的一个：

已弃用的字体标记

color是<font>标记的一个属性，不推荐使用（=不要使用它）。

<font color="red">blah...</font>

一个类属性

<span class="red_text">blah...</span>
<!-- Of course you need to define styles for ".red_text" -->

如何使用jQuery为错误消息添加颜色

2 个答案:

已弃用的字体标记

一个类属性