jquery - Jquery条件正则表达式返回输出

Question

是否可以使用正则表达式和 jQuery 来返回条件输出，我想用方括号替换图像中的数字：

[1]会成为<span><img src="1.png"></span>

我有[11]它的地方将其替换为

<span><img src="1.png"><img src="1.png"></span>

我有[1e1]它的地方将其替换为

<span><img src="1.png"><img src="e.png"><img src="1.png"></span>

但是，如果它只是文本，无论长度如何，它都会保持原样

[qu]会成为<span><img src="qu.png"></span>

这是我到目前为止的代码：

$('p').each(function() {
    var txt = $(this).text();               
    var html = txt.replace(/\[(.*?)\]/g, function($1){

        if($1.length<=3) {
            return $1.replace(/\[(.*?)\]/g,'<span class=\'rehMark\'><img src="img/$1.png" alt="$1" /></span>')
        }else{

// this is the bit I would like help with!
// and how to deal with text rather than numbers

            return '<span class=\'lngRehMark\'>'

            for (i=0; i<$1.length; i++ )
            {
                return '<img src="img/' + $1 + '.png" alt="' + $1.length + '" /></span>'
            }
            return '</span'>'
        }
    });

    $(this).html(html);
});

Answer 1

您可以使用split,map和join转换为元素[12]数组。<img>

另请注意，replace 回调的第一个参数包含完全匹配的字符串（例如[11]），而不是第一个匹配的组（例如11）。

$('p').each(function() {
    var txt = $(this).text();               
    var html = txt.replace(/\[([^\]]*)\]/g, function(match, chars){
        var images;
        if (chars.match(/^[^0-9]*$/))
            images = '<img src="img/' + chars + '.png" />';
        else
            images = $(chars.split(''))
              .map(function() { return '<img src="img/' + this + '.png" />'; })
              .get().join('');
        return '<span class=\'lngRehMark\'>' + images + '</span>';
    });

    $(this).html(html);
});