JQuery如果文本行以字符开头,则在span中包装整行

时间:2017-04-07 13:58:49

标签: javascript jquery

所以我有一些文字,我需要为以某个角色开头的线条赋予不同的颜色。 到目前为止我所拥有的是:

var msgText = $(".msgInfo").html();
var textLines = msgText.split("<br>");
$(textLines).each(function(line, text) {
  if (text.indexOf("&gt;&gt;") == 0) {
    $(".msgInfo").html(function(i, html) {
      return html.replace(text, "<span style=\"color:#BFBFBF;\">" + text + "</span>");
    });
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="msgInfo">Nova mensagem 2<br><br>Cumpts;<br>Josue<br>Apt 253<br><br>&gt;&gt;Nova mensagem 1<br>&gt;&gt;<br>&gt;&gt;<br>&gt;&gt;&gt;&gt;Como sei para que enviei a mensagem? Preciso de um campo que diga para quem foi a mensagem?<br>&gt;&gt;&gt;&gt;<br>&gt;&gt;&gt;&gt;<br>&gt;&gt;&gt;&gt;&gt;&gt;Mensagem
  de teste para verificar o nome de quem enviou o email.<br>&gt;&gt;&gt;&gt;&gt;&gt;<br>&gt;&gt;&gt;&gt;<br>&gt;&gt;<br></div>

但它并没有包裹所有的线条。只有“&gt;&gt;”以外的文字在他们中间。

我做错了什么?

感谢

1 个答案:

答案 0 :(得分:1)

这种取代似乎有点令人讨厌且成本高昂。怎么样:

var msgText = $(".viewMessage .msg .msgInfo").html();
var newText = '';
var textLines = msgText.split("<br>");
$(textLines).each(function(line,text){
    if (text.indexOf("&gt;&gt;") == 0){
        if (text.indexOf("&gt;&gt;") == 0){
        text = "<span style=\"color:#BFBFBF;\">" + text +"</span>";
    } 
    newText += text;
});
$(".viewMessage .msg .msgInfo").html(newText);

但要小心。正如epascarello指出的那样,你的jquery选择器$(".viewMessage .msg .msgInfo")可以选择多个元素。你应该确保它抓住一个元素或者做&#34; textreplace&#34;如果需要,可以找到所有找到的元素。