jQuery Text to Link Script? [duplicar]
-
05-07-2019 - |
Pregunta
Esta pregunta ya tiene una respuesta aquí:
- ¿Cómo reemplazar las URL simples con enlaces? 24 respuestas
¿Alguien sabe de un script que pueda seleccionar todas las referencias de texto a las URL y reemplazarlas automáticamente con etiquetas de anclaje que apunten a esas ubicaciones?
For example:
http://www.google.com
would automatically turn into
<a href="http://www.google.com">http://www.google.com</a>
Nota: Quiero esto porque no quiero revisar todo mi contenido y envolverlos con etiquetas de anclaje.
Solución
JQuery no te va a ayudar mucho aquí, ya que no estás realmente preocupado por el cruce / manipulación del DOM (aparte de crear la etiqueta de anclaje). Si todas sus URL estuvieran en & Lt; p class = & Quot; url & Quot; & Gt; etiquetas entonces tal vez.
Una solución de JavaScript vainilla es probablemente lo que desea, y como el destino lo tendría, este tipo debería cubrirte .
Otros consejos
NOTA: una versión actualizada y corregida de este script ahora está disponible en https: //github.com/maranomynet/linkify (licencia GPL / MIT)
Hmm ... para mí, esta parece ser la tarea perfecta para jQuery.
... algo como esto salió de mi mente:
// Define: Linkify plugin
(function($){
var url1 = /(^|<|\s)(www\..+?\..+?)(\s|>|$)/g,
url2 = /(^|<|\s)(((https?|ftp):\/\/|mailto:).+?)(\s|>|$)/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, '&')
.replace(/</g, '<')
.replace(/>/g, '>')
.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();
Intenta convertir todas las apariciones de lo siguiente en enlaces:
www.example.com/path
http://www.example.com/path
mailto:me@example.com
ftp://www.server.com/path
- ... todo lo anterior envuelto en paréntesis angulares (es decir,
<
...>
)
Disfruta :-)
Tengo esta función que llamo
textToLinks: function(text) {
var re = /(https?:\/\/(([-\w\.]+)+(:\d+)?(\/([\w/_\.]*(\?\S+)?)?)?))/g;
return text.replace(re, "<a href=\"$1\" title=\"\">$1</a>");
}
Le sugiero que haga esto en sus páginas estáticas antes de mostrarlo en el navegador, o cargará la carga del cálculo de conversión a sus visitantes pobres. :) Así es como puedes hacerlo en Ruby (leyendo desde stdin, escribiendo en stdout):
while line = gets
puts line.gsub( /(^|[^"'])(http\S+)/, "\\1<a href='\\2'>\\2</a>" )
end
Obviamente, querrás pensar en cómo hacer esto tan robusto como desees. Lo anterior requiere que todas las URL comiencen con http, y verificará que no se conviertan las URL que están entre comillas (es decir, que ya pueden estar dentro de & Lt; a href = & Quot; ... & Quot; >). No capturará ftp: //, mailto :. Felizmente convertirá material en lugares como & Lt; script & Gt; cuerpos, que quizás no quieras que sucedan.
La solución más satisfactoria es realmente hacer la conversión a mano con su editor para que pueda observar y aprobar todas las sustituciones. Un buen editor le permitirá realizar la sustitución de expresiones regulares con referencias de grupo (también conocido como referencias anteriores), por lo que no debería ser un gran problema.
Eche un vistazo a este complemento de JQuery: https://code.google.com/p / jquery-linkifier /
Hacer este lado del servidor no es una opción a veces. Piense en un widget de Twitter del lado del cliente (que va directamente a la API de Twitter usando jsonp), y desea vincular todas las URL en los Tweets dinámicamente ...
Si desea una solución desde otra perspectiva ... si puede ejecutar las páginas a través de php y HTML Purifier, puede formatear automáticamente la salida y vincular cualquier URL.