用Javascript/JQuery中的标签替换[url]标签

时间:2021-05-01 10:28:37

I'm trying to use JQuery to achieve the following logic:

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

  • Replace the string value of [url="http://www.google.com"]Google[/url] with <a href="http://www.google.com">Google</a>
  • 将[url="http://www.google.com"]谷歌[/url]的字符串值替换为谷歌

Please see my HTML page below. The problem is that on pressing the button, the orignal text is just pasted and no RegEx replacements are made.

请看下面我的HTML页面。问题是,在按下按钮时,orignal文本刚刚被粘贴,并且没有进行任何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>

I've had this RegEx pattern work using ASP.NET, so I'm not sure where the problem lies when ported to JavaScript...

我使用了ASP的RegEx模式。NET,所以我不确定当移植到JavaScript时问题在哪里…

2 个解决方案

#1


5  

That is not a valid regex. Use / as modifiers:

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

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

making the function:

的功能:

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

g at the end will repeat it over the text. Here is a fiddle: http://jsfiddle.net/xe2F9/

结尾的g将在课文中重复一遍。这里有一个小提琴:http://jsfiddle.net/xe2F9/

#2


4  

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

You specify the 'search' as a RegEx object - not a string.

您将“search”指定为RegEx对象,而不是字符串。

Just using /.../ will automatically crate one transparently.

只是使用/…/将自动透明地装一箱。

#1


5  

That is not a valid regex. Use / as modifiers:

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

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

making the function:

的功能:

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

g at the end will repeat it over the text. Here is a fiddle: http://jsfiddle.net/xe2F9/

结尾的g将在课文中重复一遍。这里有一个小提琴:http://jsfiddle.net/xe2F9/

#2


4  

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

You specify the 'search' as a RegEx object - not a string.

您将“search”指定为RegEx对象,而不是字符串。

Just using /.../ will automatically crate one transparently.

只是使用/…/将自动透明地装一箱。