Question

我有一些脚本，当你输入一些特殊字符时，它会为字母或数字生成不同的颜色。示例：^ 1 =红色^ 2 =绿色^ 3 =黄色

当我输入例如^ 1name时它正在工作。那个名字变红了。问题是当我输入数字时。例如＆＃34; ^ 1na3me＆＃34;。然后即时通讯＆＃34; na＆＃34;红色和＆＃34;我＆＃34;黄色。但它应该是＆＃34; na3me＆＃34;只有红色。它只应该在数字输入时使用^之前的颜色。有人知道为什么会这样吗？

$(this).addClass("notSelectedlanguage");

Answer 1

问题是你的正则表达式是错误的。 [^]表示列出的任何字符（^除外）。你需要像/\^0/

一样逃避它

＆＃13;

function myFunction() {
  var str = $("#demo").text();
  var res = str
    .replace(/\^0(\w+)/g, '<span style="color:black">$1</span>')
    .replace(/\^1(\w+)/g, '<span style="color:red">$1</span>')
    .replace(/\^2(\w+)/g, '<span style="color:green">$1</span>')
    .replace(/\^3(\w+)/g, '<span style="color:yellow">$1</span>')
    .replace(/\^4(\w+)/g, '<span style="color:blue">$1</span>')
    .replace(/\^5(\w+)/g, '<span style="color:cyan">$1</span>')
    .replace(/\^6(\w+)/g, '<span style="color:#D02090">$1</span>')
    .replace(/\^7(\w+)/g, '<span style="color:white">$1</span>')
  ;

  $("#demo").html(res);
};

$(function() {
  $(".word").keyup(function() {
    $(".word_preview").html($(this).val());
  });
});

＆＃13;

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>


Enter name:
<br/>
<input type="text" name="maprotation" size="50" id="textfield" class="word" class="Stil69">
<input type="reset" name="Submit3" value="Reset" />
<br/>
<br/>
<h3>2. Click the button to preview your colored name.</h3>
<br/>
<input type="button" onclick="myFunction()" value="Click here" />
<br/>
<br/>
<table bgcolor="#333333">
  <tr>
    <td><span class="word_preview" id="demo"><td></span>
  </tr>
</table>
<br/>

＆＃13;

Javascript：str-replace特殊字符

1 个答案: