使用 Jquery 在 Html URL 上创建超链接(img src 链接除外)

发布于 2024-10-12 22:43:22 字数 1427 浏览 4 评论 0原文

我试图在我的页面中的每个网址上创建一个超链接。 有这样的代码:

<div id="divC">
       Hello testing message 
       My profile link : http://stackoverflow.com/users/568085/abhishek and 
       my user account link : 
    <a href="http://stackoverflow.com/users/568085/abhishek">
    <img height="58" width="208" title="Stack Overflow profile for Abhishek at Stack Overflow, Q&amp;A for professional and enthusiast programmers" alt="Stack Overflow profile for Abhishek at Stack Overflow, Q&amp;A for professional and enthusiast programmers" src="http://stackoverflow.com/users/flair/568085.png?theme=dark">
    </a>
</div>

我使用下面的 javascript 函数在内容页面中的每个 URL 上添加链接:

<script>
   //call function for linking every url
    createLinks();
    function createLinks()
    {
        var exp=/(((\b(https?|ftp|file):\/\/))[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;     
        $("div#divC").each(function(index) {            
             $(this).html($(this).html().replace(exp, "<a target='_self' class='msg_links' href=$1>$1</a>"));
        });
    }
      </script>

在上面的代码中工作正常,但我不想在 。 当我运行此命令时,它还在
如何避免在 src 中创建链接?

I am trying to make a hyperlink on every url in my page.
There is code like this:

<div id="divC">
       Hello testing message 
       My profile link : http://stackoverflow.com/users/568085/abhishek and 
       my user account link : 
    <a href="http://stackoverflow.com/users/568085/abhishek">
    <img height="58" width="208" title="Stack Overflow profile for Abhishek at Stack Overflow, Q&A for professional and enthusiast programmers" alt="Stack Overflow profile for Abhishek at Stack Overflow, Q&A for professional and enthusiast programmers" src="http://stackoverflow.com/users/flair/568085.png?theme=dark">
    </a>
</div>

and I used below javascript function to add link on every URL in content page :

<script>
   //call function for linking every url
    createLinks();
    function createLinks()
    {
        var exp=/(((\b(https?|ftp|file):\/\/))[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;     
        $("div#divC").each(function(index) {            
             $(this).html($(this).html().replace(exp, "<a target='_self' class='msg_links' href=$1>$1</a>"));
        });
    }
      </script>

In above code working fine but I don't want to create link on <img src='www.test.com'>.
when I run this it also created link in the <img src="<a href='www.test.com'>www.test.com</a>" > ,
How can I avoid create link in <img> src.?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

川水往事 2024-10-19 22:43:22

啊...我明白你在做什么。我不久前就这么做了,构建了一个插件来替换 smiley 的 :D。这段代码工作得更好吗?

 //call function for linking every url
    createLinks();


    function createLinks()
    {
        var exp=/(((\b(https?|ftp|file):\/\/))[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;     


        $("div#divC")
        .contents()
        .filter(function () {

            if (typeof (Node) == 'undefined') {
                return this.nodeType == 3;
            }
            else {
                return this.nodeType == Node.TEXT_NODE;
            }
        }).each(function(index) {  

            var x = $(this)[0].nodeValue;
            if (x != '') {
               x = x.replace(exp, "<a target='_self' class='msg_links' href='$1'>$1</a>");
               $(this).replaceWith(x);
            }
        });
    }

Ah... I see what you are doing. I've did it a while ago, building a plugin that replaces smiley's :D. Does this code work better?

 //call function for linking every url
    createLinks();


    function createLinks()
    {
        var exp=/(((\b(https?|ftp|file):\/\/))[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;     


        $("div#divC")
        .contents()
        .filter(function () {

            if (typeof (Node) == 'undefined') {
                return this.nodeType == 3;
            }
            else {
                return this.nodeType == Node.TEXT_NODE;
            }
        }).each(function(index) {  

            var x = $(this)[0].nodeValue;
            if (x != '') {
               x = x.replace(exp, "<a target='_self' class='msg_links' href='$1'>$1</a>");
               $(this).replaceWith(x);
            }
        });
    }
定格我的天空 2024-10-19 22:43:22

将 id 添加到您的标签中并将其与您的 jquery 匹配,

 1. <a id="target" href="your/target/url">
 2. ${"#target"}.attr('href','new/target/url')

这是因为您正在使用 .each()。如果您想更改多个,请使用标签的类属性。

Put an id to you tag and match it with your jquery

 1. <a id="target" href="your/target/url">
 2. ${"#target"}.attr('href','new/target/url')

It is because you are using .each(). If you want to change multiple use a class attribute for your tags.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文