如何插入< em>当超过140限制，即负面？ [英] How to insert <em> tag when exceeding 140 limit i.e. going negative?

问题描述

有可能以某种方式将 放在输入的字符上，当用户超过了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; 
 $ b （剩余< 5 ||剩余> = text_max）$（父母）.find（.black）.html（剩余）; 
 
 .btn）。prop（disabled，true）; 
 else $（parent）.find（。btn）。prop（disabled，false）; 
}）; 
  

这是我的小提琴：。你应该做的是创建一个标准的div（将其设置为textarea）并使其具有可信度。然后在div中添加一个onkey事件，并检查长度是否高于140.如果是获取文本，则对其进行分片，并将html应用于多余部分。

请注意，您希望使用 element.textContent 获取文本内容，并将html写入 element.innerHTML 。

你应该做的另一件事是处理粘贴事件，因为默认情况下浏览器会复制html，所以他们会搅乱你contenteditable。

编辑：
如果您必须在表单中使用它，您需要 textarea 或一个输入隐藏在哪里存储div内容并发送请求。

要做到这一点，你可以在jQuery中做这样的事情：

  $（'＃form'）。submit（function（e）{
 var input = $（'＃inputdiv'）。text（）; 
 if（input.length <= 140）{ 
 $（'＃formtextarea'）。val（input）; 
 return true; 
} 
 return false; 
}）; 
  

或者你可以用ajax做到这一点。

< pre $函数sendStuff（）{
$ .post（test.php，{message：$（'＃inputdiv'）。text（）}）
.done（function（data）{
//在这里做某事
}）;
}

is it possible to somehow put on the chars that are typed in when the user has exceeded the 140 characters limit, and is now in -1 negative etc. Like, modify the background of the text to be red.

$(".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);
 });

Here's my fiddle: http://jsfiddle.net/3sCfG/56/

EDIT: are wrap or wrapInner good to use, I am using keyup event which might be a problem, as it adds too many em tags, is there a good solution to get each char after 140 limit and wrap append each inside one single ?

Here's a screenshot from Twitter, I want to highlight text like that:

解决方案

You can't style only some parts of a textarea, but you can do that with contenteditable. What you should do is create a standard div (style it as a textarea) and make that contenteditable. Then put an onkey event in the div and check if the length is higher than 140. If it is get text, slice it, and apply an html to the excess.

Note that you want to get text content with element.textContent and write the html to element.innerHTML.

Another thing you should do is handle paste events because by default the browsers copy the html, so they will mess your contenteditable.

EDIT: If you have to use it in a form you need a textarea or an input hidden where to store the div content and send in the request.

To do that you can do something like this in jquery:

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

Or you could do that with ajax.

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

这篇关于如何插入&lt; em&gt;当超过140限制，即负面？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！