Javascript：str替換特殊字符

我有一些腳本在輸入特殊字符時爲字母或數字生成不同的顏色。實施例：^ 1 =紅^ 2 =綠色^ 3 =黃色Javascript：str替換特殊字符

其當我例如^ 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>

來源

2016-05-13 hansfrans

你永遠不會關閉跨度，以便它並沒有太大的意義....你知道什麼是'[^]'實際上沒有在正則表達式？ [MDN REG EXP字符集（https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp#character-sets） – epascarello

這是因爲'[^]'是空的否定列表你需要使用'^ ^' – jcubic

問題是你的正則表達式是錯誤的。 [^]表示列出的任何字符（^除外）。你需要逃避它像/\^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/>

來源

2016-05-13 12:24:16 Justinas

來逃避'^'的角色。當我輸入一個像^ 1john^doe ^這樣的名字時，那麼^^^變黑，但它應該是紅色的。 – hansfrans

@hansfrans對於那個正則表達式就像'\^1（。*）'。我不能寫出最好的正則表達式，因爲你沒有爲輸入的字符串指定詳細的規則 – Justinas

如果只輸入^，那麼顏色不應該改變。 – hansfrans

Javascript：str替換特殊字符

回答

相關問題