问Javascript: str-替换特殊字符
EN

Stack Overflow用户

提问于 2016-05-13 12:13:13

回答 1查看 1.4K关注 0票数 0

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

例如，当我输入^1 1name时，它就开始工作了。那名字就变红了。问题是当我输入数字的时候。例如"^1na3me“。然后我得到红色的"na“和黄色的”我“。但应该是红色的"na3me“。它只应采取颜色时，数字被输入与^在它之前。有人知道为什么会这样吗？

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
$(function()
{
$(".word").keyup(function()
{
var word=$(this).val();
$(".word_preview").html(word);
return false;
});
});
</script>
<script>

function myFunction() {
    var str = document.getElementById("demo").innerHTML; 
    var res = str.replace(/[^]0/g, '<span style="color:black">').replace(/[^]1/g, '<span style="color:red">').replace(/[^]2/g, '<span style="color:green">').replace(/[^]3/g, '<span style="color:yellow">').replace(/[^]4/g, '<span style="color:blue">').replace(/[^]5/g, '<span style="color:cyan">').replace(/[^]6/g, '<span style="color:#D02090">').replace(/[^]7/g, '<span style="color:white">');
    document.getElementById("demo").innerHTML = res;
};
</script>
</head>
<body>
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/>
</body>
</html>

javascript

str-replace

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-05-13 12:24:16

问题是你的判断力是错的。[^]是指列出的任何字符(^除外)。你需要像/\^0/一样逃离它

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

<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/>

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/37209795

复制

相似问题

问Javascript: str-替换特殊字符
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Javascript: str-替换特殊字符EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Javascript: str-替换特殊字符
EN