Texte jQuery pour lier le script? [dupliquer]

StackOverflow https://stackoverflow.com/questions/247479

Question

    

Cette question a déjà une réponse ici:

         

Quelqu'un connaît-il un script capable de sélectionner toutes les références textuelles aux URL et de les remplacer automatiquement par des balises d'ancrage pointant vers ces emplacements? 

For example:

http://www.google.com 

would automatically turn into

<a href="http://www.google.com">http://www.google.com</a>

Remarque: je le veux parce que je ne veux pas parcourir tout mon contenu et les envelopper avec des balises d'ancrage.

Était-ce utile?

La solution

JQuery ne va pas vous aider énormément ici car vous n'êtes pas vraiment concerné par la manipulation / la traversée du DOM (à part la création de la balise anchor). Si toutes vos URL étaient dans & Lt; p class = & "Url &"; & Gt; balises alors peut-être.

Une solution JavaScript vanille est probablement ce que vous voulez, et comme le destin l’a voulu, ce gars devrait vous avoir couvert .

Autres conseils

REMARQUE: une version mise à jour et corrigée de ce script est désormais disponible à l'adresse https: //github.com/maranomynet/linkify (licence GPL / MIT)

Hmm ... cela me semble être la tâche idéale pour jQuery.

... quelque chose comme ça m'est venu à l'esprit: 

// Define: Linkify plugin
(function($){

  var url1 = /(^|&lt;|\s)(www\..+?\..+?)(\s|&gt;|$)/g,
      url2 = /(^|&lt;|\s)(((https?|ftp):\/\/|mailto:).+?)(\s|&gt;|$)/g,

      linkifyThis = function () {
        var childNodes = this.childNodes,
            i = childNodes.length;
        while(i--)
        {
          var n = childNodes[i];
          if (n.nodeType == 3) {
            var html = $.trim(n.nodeValue);
            if (html)
            {
              html = html.replace(/&/g, '&amp;')
                         .replace(/</g, '&lt;')
                         .replace(/>/g, '&gt;')
                         .replace(url1, '$1<a href="http://$2">$2</a>$3')
                         .replace(url2, '$1<a href="$2">$2</a>$5');
              $(n).after(html).remove();
            }
          }
          else if (n.nodeType == 1  &&  !/^(a|button|textarea)$/i.test(n.tagName)) {
            linkifyThis.call(n);
          }
        }
      };

  $.fn.linkify = function () {
    return this.each(linkifyThis);
  };

})(jQuery);

// Usage example:
jQuery('div.textbody').linkify();

Il tente de transformer toutes les occurrences des éléments suivants en liens:

  • www.example.com/path
  • http://www.example.com/path
  • mailto:me@example.com
  • ftp://www.server.com/path
  • ... tout ce qui est mentionné ci-dessus est placé entre crochets (c.-à-d. < ... >)

Profitez de: -)

J'ai cette fonction que j'appelle 

textToLinks: function(text) {

    var re = /(https?:\/\/(([-\w\.]+)+(:\d+)?(\/([\w/_\.]*(\?\S+)?)?)?))/g;
    return text.replace(re, "<a href=\"$1\" title=\"\">$1</a>");
  }

Je vous suggère de le faire sur vos pages statiques avant de le rendre au navigateur, sinon vous allez imposer le fardeau du calcul de la conversion à vos pauvres visiteurs. :) Voici comment procéder en Ruby (lecture de stdin, écriture sur stdout): 

while line = gets
  puts line.gsub( /(^|[^"'])(http\S+)/, "\\1<a href='\\2'>\\2</a>" )
end

De toute évidence, vous voudrez peut-être réfléchir à la manière de rendre cela aussi robuste que vous le souhaitez. Ce qui précède requiert que toutes les URL commencent par http, et vérifie de ne pas convertir les URL entre guillemets (c'est-à-dire qui peuvent déjà se trouver dans un & Lt; un href = & "; ... &"; >). Il ne va pas attraper ftp: //, mailto :. Il se fera une joie de convertir du matériel dans des endroits tels que & Lt; script & Gt; corps, que vous ne voulez peut-être pas arriver.

La solution la plus satisfaisante consiste à effectuer la conversion à la main avec votre éditeur afin de pouvoir observer et approuver toutes les substitutions. Un bon éditeur vous permettra de remplacer les expressions rationnelles par des références de groupe (aussi des références arrières), un gros problème.

Jetez un coup d'oeil à ce plugin JQuery: https://code.google.com/p / jquery-linkifier /

Faire ce côté serveur n'est pas une option parfois. Pensez à un widget Twitter côté client (qui se connecte directement à l'API Twitter à l'aide de jsonp) et souhaitez lier de manière dynamique toutes les URL des Tweets ...

Si vous voulez une solution d'un autre point de vue ... si vous pouvez exécuter les pages via php et HTML Purifier, il est possible de formater automatiquement la sortie et de lier toutes les URL.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top