سؤال

هذا السؤال لديه بالفعل إجابة هنا:

هل يعرف أحد برنامجًا نصيًا يمكنه تحديد جميع المراجع النصية لعناوين URL واستبدالها تلقائيًا بعلامات ربط تشير إلى تلك المواقع؟

For example:

http://www.google.com 

would automatically turn into

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

ملحوظة:أريد هذا لأنني لا أريد الاطلاع على كل المحتوى الخاص بي ولفه بعلامات الربط.

هل كانت مفيدة؟

المحلول

لن يساعدك JQuery كثيرًا هنا لأنك لست مهتمًا حقًا باجتياز/معالجة DOM (بخلاف إنشاء علامة الربط).إذا كانت جميع عناوين URL الخاصة بك موجودة في علامات <p class="url">، فربما.

من المحتمل أن يكون حل JavaScript الفانيليا هو ما تريده، وكما شاء القدر، هذا الرجل يجب أن يغطيك.

نصائح أخرى

ملحوظة: يتوفر الآن إصدار محدث ومصحح من هذا البرنامج النصي على https://github.com/maranomynet/linkify (رخصة GPL/MIT)


همم...بالنسبة لي، تبدو هذه المهمة المثالية لـ jQuery.

...شيء من هذا القبيل جاء من أعلى ذهني:

// 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();

يحاول تحويل جميع التكرارات التالية إلى روابط:

  • www.example.com/path
  • http://www.example.com/path
  • mailto:me@example.com
  • ftp://www.server.com/path
  • ...كل ما سبق ملفوف بين قوسين زاوية (أي. <...>)

يتمتع :-)

لدي هذه الوظيفة التي أسميها

textToLinks: function(text) {

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

أقترح عليك القيام بذلك على صفحاتك الثابتة قبل عرضها على المتصفح، وإلا فإنك ستلقي عبء حساب التحويل على عاتق زوار موقعك الفقراء.:) إليك كيفية القيام بذلك في روبي (القراءة من stdin، والكتابة إلى stdout):

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

من الواضح أنك ستحتاج إلى التفكير في كيفية جعل هذا الأمر قويًا كما تريد.يتطلب ما ورد أعلاه أن تبدأ جميع عناوين URL بـ http، وسيتم التحقق من عدم تحويل عناوين URL الموجودة بين علامتي الاقتباس (أي.والتي قد تكون موجودة بالفعل داخل <a href="...">).لن يمسك ftp://، mailto:.سيكون من دواعي سروري تحويل المواد في أماكن مثل أجسام <script>، وهو ما قد لا ترغب في حدوثه.

الحل الأكثر إرضاءً هو إجراء التحويل يدويًا باستخدام المحرر الخاص بك حتى تتمكن من النظر والموافقة على جميع البدائل. محرر جيد سيتيح لك إجراء استبدال regexp بمراجع المجموعة (المعروفة أيضًا باسم المراجع الخلفية)، لذلك لا ينبغي أن يكون الأمر مشكلة كبيرة.

ألق نظرة على هذا البرنامج المساعد JQuery: https://code.google.com/p/jquery-linkifier/

إن القيام بهذا من جانب الخادم ليس خيارًا في بعض الأحيان.فكر في أداة Twitter من جانب العميل (التي تنتقل مباشرةً إلى Twitter API باستخدام jsonp)، وتريد ربط جميع عناوين URL في التغريدات ديناميكيًا...

وإذا أردت الحل من منظور آخر..إذا كان بإمكانك تشغيل الصفحات من خلال php وHTML Purifier، فيمكنه تنسيق الإخراج تلقائيًا وربط أي عناوين URL.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top