Question

我想实现以下目标：

1）检查textarea中的每个单词是否为吉他和弦。

为此，我创建了一个包含吉他和弦所有字符的数组（如果一个单词与这个数组中的字符匹配则是吉他和弦）：

var Regex = /^\s*(?:(A|B|C|D|E|F|G|A#|C#|D#|F#|G#|Ab|Bb|Db|Eb|Gb){1}(?:m|\+|\-|aug|dim|add|b|#|1|2|3|4|5|6|7|8|9|0|\/)*\s*)+$/;

2）如果一个单词匹配，我希望它成为一个链接，指向由该单词本身定制的URL。

e.g。以下一行

Am   Bb  C# Dadd9
Song lyrics here

应该变成

<a href="example.com/Am">Am</a>   <a href="example.com/Bb">Bb</a>  <a href="example.com/C#">C#</a> <a href="example.com/Dadd9">Dadd9</a>
Song lyrics here

以下是我为第2步所做的事情：

var link = "http://www.example.com/";
      $.each(chord, function(index, value) {   //append link to chord
        $('.output').append('<a href="' + link + value + '">' + value + '</a> ');
      });

但我需要定义＆＃34;和弦＆＃34;。如何检查每个单词，然后是否为和弦（匹配＆＃34;正则表达式＆＃34;字符）附加链接？

Answer 1

您可以使用String.prototype.replace()。

为简洁起见，我们假设我们想要定位 Am ， Bb 和 C＃和弦。

// create a map for the chords to the anchors
var chordsAnchorsMap = {
    "Am": "<a href='https://example.com/a-minor'>Am</a>",
    "Bb": "<a href='https://example.com/b-flat'>Bb</a>",
    "C#": "<a href='https://example.com/c-sharp'>C#</a>"
};

// regular expression for the chords
var regex = /(Am|Bb|C#)/g;

var string = "Am    Bb    C#    Bb   M    Bb";

// replace all instances of the chords with their mapped anchors
var result = string.replace(regex,
    function(capturedChord) {
        // if chord is mapped to an anchor, replace it with the appropriate anchor
        if (chordsAnchorsMap.hasOwnProperty(capturedChord)) {
            return chordsAnchorsMap[capturedChord];
        }
        // else, return the just chord itself (in other words - don't replace it)
        return capturedChord;
    }
);

现在result将包含：

<a href='https://example.com/a-minor'>Am</a>    <a href='https://example.com/b-flat'>Bb</a>    <a href='https://example.com/c-sharp'>C#</a>    <a href='https://example.com/b-flat'>Bb</a>   M    <a href='https://example.com/b-flat'>Bb</a>

Answer 2

以下是@ GuyWaldman方法的精炼版本。

这样做是为了动态生成HTML元素而不是使用对象。

var chordPattern = /(?:(A|B|C|D|E|F|G|A#|C#|D#|F#|G#|Ab|Bb|Db|Eb|Gb){1}(?:m|\+|\-|aug|dim|add|b|#|1|2|3|4|5|6|7|8|9|0|\/)+)/g;
var str = `Am   Bb  C# Dadd9
           Song lyrics here`;
var html = str.replace(chordPattern, function(value){
    return "<a href='https://example.com/"+value+"'>"+value+"</a>";
});
document.write(html);

您可能需要调整正则表达式，因为我不确定它是否会匹配所有可能的和弦，或者它是否仅与和弦匹配。您还必须找到一种方法来处理URL中的特殊字符

检查文本中的任何单词是否与数组匹配

2 个答案: