Question

我想在带有jQuery的字符串中的第一个单词之后添加span类。我使用以下代码：

$('h1').each(function(){
    var test = $(this);
    test.html( test.text().replace(/(^\w+)/,'<span>$1</span>') );
});

这适用于标准字符，但不适用于非英文字符。

请看演示，它应该选择整个单词“Bài”，但它只选择“B”。如何解决这个问题？

演示： http://jsfiddle.net/hez4ohpc/

感谢。

Answer 1

目前，JavaScript正则表达式中对Unicode的支持非常差（this will be much better in ES6）。在这种情况下，您最好的选择可能是使用更完整的正则表达式解决方案。我所知道的最好的是XRegExp库。

第二个最佳选择是尝试定义不会创造一个词的内容：

.replace(/([^\s\.,\:;!?]+)/,'<span>$1</span>')

但那很危险，以后当你意识到忘记了什么时，你会让你惊喜。

Answer 2

试试这个：

$('h1').each(function(){
    var test = $(this);
    test.html( test.text().replace(/(^[^\s]+ )/,'<span>$1</span>') );
});

Answer 3

也许那个？

$('h1').each(function(){
    var test = $(this);
    test.html( test.text().replace(/(^[^\s,\.\:\;\"]+)/,'<span>$1</span>') );
});

Answer 4

以下是您问题的另一种解决方案，您无需逃避或替换任何内容。

$('h1').each(function() {
   var html = $(this).html();
   var word = html .substr(0, html.indexOf(" "));
   var rest = html .substr(html.indexOf(" "));
   $(this).html(rest).prepend($("<span/>").html(word).addClass("em"));
});

JSFiddle

编辑： 正如评论中所讨论的，此解决方案的缺点是，无法正常工作，如果 第一个字 没有跟踪 空格。

用jQuery选择字符串中的第一个单词

4 个答案: