2015-09-29 2 views
-1

У меня есть textarea, где пользователь вводит свои коды и тег div, где он отображает, как он будет отображаться на веб-странице. Я использую пользовательские теги для форматирования кодов пользователей, таких как [b]bold text[/b], а не <b>bold text </b> Я использую функцию string.replace() для замены пользовательского тега с оригинальным кодом для предварительного просмотра тегов. Но как можно использовать косую черту (/) как совпадающий шаблониспользуя косую черту как соответствующий шаблон в regex

Я уже прошел, хотя пары знают метод. Я попытался

string.replace(/[\/b]/gi,"</b>"); 
string.replace(/[\x2Fb]/gi,"</b>"); 
string.replace(/[\x2F b]/gi,"</b>"); 

Вот код, как я на самом деле делать это в моем проекте

//Helper Function 
function $(id){ 
    return document.getElementById(id); 
} 
//Helper Variables// 

//Display Preview of question 
function render(){// 
    var question_content = $("question_content").value; 
    //Sanitizing data// 
    var entitles = {//List of all Html entitles & custum entitles 
     '<':"&lt;", 
     '>':"&gt;", 
     '\n':"<br>", 
     '[b]':"<b>", 
     '[/b]':"</b>", 
     '[i]':"<i>",  
     '[/i]':"</i>", 
     '[code]':"<code class='prettyprint'>", 
     '[/code]':"</code>"   
    } 
    question_content = question_content.replace(/<|>|\n|[b]|[\/b]/gi, function (html_ent){return entitles[html_ent];}); 
    //question_content = question_content.replace(/'/, "</b>"); 
    var preview = $("preview"); 
    preview.innerHTML = question_content; 
    //prettyPrint(); 
} 

ответ

2

На самом деле, первый подход сработал бы, если вы не забыли о вылетающих скобках:

string.replace(/\[\/b]/gi,"</b>"); 

Однако только открытие должно быть экранировано; regex engine достаточно умен, чтобы различать ] как буквенный символ и как метасимвол (который закрыл подвыражение класса символов).

В целом, вы можете упростить ваш код, используя что-то вроде этого:

var codes = ['b', 'i', 'code']; 
// here goes a little hack to enable special decoration for some elements 
codes.code = 'class="prettyprint"'; 

var string = 'abc[b]abc[/b]da[code]s[/code][something]d'; 
string.replace(/\[(\/?)([a-z]+)]/gi, function(m, p1, p2) { 
    return codes.indexOf(p2) !== -1 
    ? '<' + p1 + p2 + (!p1 && p2 in codes ? ' ' + codes[p2] : '') + '>' 
    : m 
}); 

Это, конечно, можно выразить тот же алгоритм с словарем (объект), например:

var decorators = { 
    b: '', i: '', 
    code: 'class="prettyprint"' 
}; 

var string = 'abc[b]abc[/b]da[code]s[/code][something]d'; 
string.replace(/\[(\/?)([a-z]+)]/gi, function(m, p1, p2) { 
    return p2 in decorators 
    ? '<' + p1 + p2 + 
     (!p1 && decorators[p2] ? ' ' + decorators[p2] : '') + '>' 
    : m; 
}); 
Смежные вопросы