jquery - 使用 JQuery 在文本框内添加验证检查

Question

当用户满足特定条件时，我试图在文本框中添加验证(绿色复选标记)。我正在使用 JQuery 来完成此操作。 我使用 Fontawesome 图标尝试了以下代码，但它不起作用:

$('#username').append('<i style="display:inline;color: #3a7d34;" class="icon-check-sign"></i>');

如果有人能给我一些好的建议，我将不胜感激。

更新:

下面是我的 html 代码片段，试图在文本框中放置一个复选框

            <tr>
                <td style="text-align: left">
                    @Html.LabelFor(m => m.Username, "Username")
                </td>
            </tr>
            <tr>
                <td style="padding-left: 5px">
                    @Html.UsernameFor(m => m.Username,
                        new
                        {
                            @class = "inputClass1 inputClass2",
                            style = "width:150px",
                            id = "username",
                            onkeyup = " return validateUsername() "

                        })
                    @Html.ValidationMessageFor(model => model.Username)

                </td>
            </tr>

谢谢，

WH

Answer 1

您不能在文本输入内附加图标，而是将其放在旁边:

$(function() {
$('.test').append('<i style="display:inline;color: #3a7d34;">&#10004;</i>');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input><span class="test"></span>

http://jsfiddle.net/fhff4w3u/1/