编辑器中的JavaScript锚标记解析器

JavaScript anchor tag parser from editor

本文关键字：JavaScript 编辑器      更新时间：2023-09-26

我正在使用JavaScript制作一个编辑器，我正在寻找一种方法，当用户键入。。作为编辑器div中的输入，链接显示在其他窗口中，当我单击按钮时，它从编辑器div中消失类似activelink.js的实时演示，但不知道如何实现。

编辑：：用户可以使用标记在文本编辑器中输入链接。例如，"这是一个链接"。当用户单击"完成"时，编辑器应该检测用户是否在编辑器中输入了链接标记。如果是，请将该文本作为实际链接（如下所示：这是一个链接）添加到页面底部（文本编辑器之外）。页面底部的链接应该交替使用红色和蓝色，并且它们不需要实际链接到另一个网站。

请参阅此示例

$("button").click(function(){
    var text = $("textarea").val();
    var anchor = text.match(/(<a.*?'/a>)/g);
    if (anchor != null){
        anchor.forEach(function(value, index){
            $("#anchorBox").append(value);
        });
    }
    $("textarea").val("");
});
#anchorBox > a {
    display: block;
}
#anchorBox  > a:nth-child(odd) {
    color:red;
}
#anchorBox  > a:nth-child(even) {
    color:blue;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea></textarea>
<button>done</button>
<div id="anchorBox"></div>

相关文章：