将[url]标记替换为<a href=""> tags in Javascript/JQuery</a>

时间:2013-05-13 14:55:10

标签: javascript jquery regex

我正在尝试使用JQuery来实现以下逻辑:

  • [url="http://www.google.com"]Google[/url]的字符串值替换为<a href="http://www.google.com">Google</a>

请参阅下面的HTML页面。问题是,按下按钮时,只会粘贴原始文本,并且不会进行RegEx替换。

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Test</title>
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript">
        //<![CDATA[
        function processJs() {
            var oldtext = $("#oldtext").html();
            var newtext = oldtext.replace('\[url\s?=\s?"?(.*?)"?\](.*?)\[\/url\]', '<a href="$1">$2</a>');
            $('#mydiv').html(newtext);
        }
        //]]>
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div id="oldtext">
            Try this funky new search engine:
            [url="http://www.google.com"]Google[/url]
            Or this older one from back in the day:
            [url="http://uk.altavista.com"]AltaVista[/url]
        </div>
        <div>
            <input type="button" id="btn" value="Replace" onclick="processJs(); return false;" />
        </div>
        <div id="mydiv" style="background-color: #eeeeee; border: 2px inset #aaaaaa">
            Replaced text will go here.
        </div>
    </form>
</body>
</html>

我已经使用了这个RegEx模式,所以我不确定移植到JavaScript时问题出在哪里......

2 个答案:

答案 0 :(得分:5)

这不是一个有效的正则表达式。使用/作为修饰符:

/\[url\s?=\s?"?(.*?)"?\](.*?)\[\/url\]/

制作功能:

function processJs() {
    var oldtext = $("#oldtext").html();
    var newtext = oldtext.replace(/\[url\s?=\s?"?(.*?)"?\](.*?)\[\/url\]/g, '<a href="$1">$2</a>');
    $('#mydiv').html(newtext);
}

g最后会在文字上重复一遍。这是一个小提琴:http://jsfiddle.net/xe2F9/

答案 1 :(得分:4)

var newtext = oldtext.replace(/\[url\s?=\s?"?(.*?)"?\](.*?)\[\/url\]/g, '<a href="$1">$2</a>');

您将“搜索”指定为RegEx对象 - 而不是字符串。

只需使用/.../就会自动对其进行透明打包。