javascript - 下划线/微模板替换换行符 - 奇怪的行为

标签 javascript regex templates underscore.js underscore.js-templating

我正在使用 Underscore 模板(基于 John Resig 的 Microtemplate),每当我尝试替换其中的换行符时,都会出现奇怪的行为。例如,如果我有这样的文字:

var message = 'Line1\r\n\r\nLine2';

如果我这样做,我可以用 br 标签正确地替换换行符:
$('#example1_no_template').html(message.replace(/\r?\n/g, '<br />'));

但是,如果我尝试用下面的示例代码替换 Underscore 模板中的换行符,我不会插入任何 br 标记:
<script id="template1" type="text/html">
    <%= message.replace(/\r?\n/g, '<br />') %>
</script>

<script>
var template1 = _.template($('#template1').html());
$('#example1_template').html(template1({ message: message }));
</script>

奇怪的是,如果我将模板内的正则表达式更改为以下内容,那么我会在各处插入各种 br 标签:
<script id="template3" type="text/html">
    <%= message.replace(/[\r\n?]/g, '<br /><br />') %>
</script>

所有这些行为都显示在这个 fiddle 中:http://jsfiddle.net/GHtDY/5/

知道发生了什么吗?是否可以替换模板内的换行符?

最佳答案

我想知道 Underscore 的模板解析器是否在某处有一点错误。如果您使用 RegExp 对象语法而不是正则表达式文字语法:

<script id="template1" type="text/html">
    <%= message.replace(new RegExp('\r?\n', 'g'), '<br />') %>
</script>

然后你开始得到预期的结果:http://jsfiddle.net/ambiguous/GHtDY/6/

您的“时髦输出”示例:
<%= message.replace(/[\r\n?]/g, '<br /><br />') %>

出来很时髦,因为下划线正在用你的 <br> 替换 n元素。无论如何,该字符类应该匹配任何单个 CR、LF 或问号,而这不是你想要做的。

我怀疑 Underscore 的模板解析器对一些正则表达式文字有一些问题;你会注意到 /\s/g也没有按预期工作。特别是,它似乎在解析转义序列时遇到了一些问题,例如 \r。和 \s在正则表达式文字内。例如,这个:
<script id="template1" type="text/html">
    <%= message.replace(/\d/g, '<br /><br />') %>
</script>
message 时无法按预期工作包含一些数字但使用 new RegExp
<script id="template1" type="text/html">
    <%= message.replace(new RegExp('\d', 'g'), '<br /><br />') %>
</script>

确实按预期工作。

关于javascript - 下划线/微模板替换换行符 - 奇怪的行为,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7683149/

相关文章:

Javascript if (document.images)

Python 正则表达式拆分为模式中的可选单词

python - 如何使用Python使用正则表达式在字符串中搜索/查找特殊字符,例如&,<或>

c++ - 如何扩展 integer_sequence?

javascript - POST 请求后 Django 不呈现

javascript - 如何在Chrome扩展程序/应用程序中绘制到另一个.html页面?

php - 如何使用 javascript 在提交时重定向当前选项卡?

javascript - Javascript Regexp搜索特定类

c++ - 重载的模板方法未按预期解析

c# - 如何在WPF中将ControlTemplate转换为XAML字符串?