jQuery +正则表达式替换textarea中的href和src值

时间:2013-06-26 16:11:27

标签: javascript jquery html regex expression

我有各种textareas:

<textarea><a href="/"><img src="/image1.gif" /></a></textarea>
<textarea><a href="/"><img src="/image2.gif" /></a></textarea>
<textarea><a href="/"><img src="/image2.gif" /></a></textarea>

使用jQuery我试图用regexp替换href和src值(src初始值必须保留),并将其转换为:

<textarea><a href="http://www.sitename.com"><img src="http://www.sitename.com/image1.gif" /></a></textarea> // see how we preserve the original src value by just adding the sitename
<textarea><a href="http://www.sitename.com"><img src="http://www.sitename.com/image2.gif" /></a></textarea>
<textarea><a href="http://www.sitename.com"><img src="http://www.sitename.com/image2.gif" /></a></textarea>

我发现使用以下正则表达式(?<=href=(\"|'))[^\"']+(?=(\"|'))(?<=src=(\"|'))[^\"']+(?=(\"|'))我可以找到值,但其他人不知道......

到目前为止,这是我的代码:

$(function(){
        (function(){
            $('textarea').each(function(){
                var obj = $(this);
                obj.text().replace(REGEXP,"http://www.sitename.com/);  //by placing the above regexp the script wont work

                //missing the src part

            });
        })();
    });

感谢任何帮助

4 个答案:

答案 0 :(得分:4)

您可以将textarea的内容转换为jquery DOM元素集合(假设您可以依赖HTML有效)。

$('textarea').each(function(){
    var $obj = $("<div>" + $(this).val() + "</div>");
    $obj.find("a").attr("href", function (_, href) {
        return "http://www.sitename.com" + href;
    }).find("img").attr("Src", function (_, src) {
        return "http://www.sitename.com" + src;
    });
    $(this).val($obj.html());
});

http://jsfiddle.net/RPEzH/2/

答案 1 :(得分:1)

我喜欢这个解决方案

$('textarea').each(function(){

    // url helper function
    // this function will not prepend if the domain is already present
    var appendDomain = function(url) {
      return url.replace(
        /^(?:http:\/\/www\.sitename\.com)?/,
        'http://www.sitename.com'
      );
    };

    // create an html wrapper
    var html = $('<div></div>');

    // append current textarea contents
    html.append($(this).val());

    // find the A and IMG elems
    var a   = html.find('a'),
        img = a.find('img');

    // set the new href
    a.attr('href', function(idx, href){
        return appendDomain(href)
    });

    // set the new src
    img.attr('src', function(idx, src) {
        return appendDomain(src)
    });

    // set the new html
    $(this).val(html.html());

});

See it working on JSFIDDLE

答案 2 :(得分:0)

你不需要正则表达式来做到这一点。您只需连接当​​前网址和网站网址。

$('textarea').each(function(){
            var obj = $(this);
            obj.find('a').attr('href', 'http://www.sitename.com' + obj.find('a').attr('href'));
            obj.find('img').attr('src', 'http://www.sitename.com' + obj.find('img').attr('src'));
        });

答案 3 :(得分:0)

正则表达式解决方案也不太难::))

$(window).load(function() {


   $('textarea').each(function(){

    replaces= 'http://www.sitename.com';    

    text=$(this).text();

new_text=text.replace(/<a href=\"\/">/g,'<a href="'+replaces+'" >');

newest=new_text.replace(/<img src=\"/g,'<img src="'+replaces);

$(this).val(newest);

   })

});