jquery - 超过140个限制(即变为负数)时如何插入<em>标签？

当用户输入的字符超过140个字符的限制，并且现在是-1负数等，是否可以将文本的背景修改为红色。

$(".comment-box").keydown(function () {
    var parent = $(this).parent();
    var text_max = 140;
    var length_reached = $(this).val().length;
    var remaining = text_max - length_reached;

    $(parent).find('.counter').html(remaining);

    if (remaining < 5 || remaining >= text_max) $(parent).find(".btn").prop("disabled", true);
    else $(parent).find(".btn").prop("disabled", false);
 });

这是我的小提琴：http://jsfiddle.net/3sCfG/56/
编辑：wrap或wrapiner好用吗？我使用的keyup事件可能是个问题，因为它添加了太多的em标记，有没有一个好的解决方案可以在140个限制之后获取每个字符，并将每个字符包装在一个单独的包中？
这是Twitter的截图，我想突出显示这样的文本：

最佳答案

您不能只对textarea的某些部分进行样式设置，但可以使用contenteditable进行样式设置。您应该做的是创建一个标准div（将其样式设置为textarea）并使其内容可编辑。然后在div中输入onkey事件，检查长度是否大于140。如果它是get text，则对它进行切片，并对多余的部分应用html。
请注意，您希望使用element.textContent获取文本内容，并将html写入element.innerHTML。
你应该做的另一件事是处理粘贴事件，因为默认情况下浏览器会复制html，这样它们会把你的contenteditable弄乱。
编辑：
如果必须在表单中使用它，则需要一个textarea或input hidden来存储div内容并发送请求的位置。
为此，可以在jquery中执行以下操作：

$('#form').submit(function(e) {
    var input = $('#inputdiv').text();
    if(input.length <= 140) {
        $('#formtextarea').val(input);
        return true;
    }
    return false;
});

或者你可以用ajax来实现。

function sendStuff() {
    $.post("test.php", { message: $('#inputdiv').text()})
    .done(function(data) {
         // do something here
    });
}