URL in tekst omzetten naar link
Ik wil met jQuery een url in een tekst omzetten naar link.
Niet moeilijk met dit:
Code (php)
1
$(this).html($(this).html().replace(/(https?:\/\/.+?)(?:\s|$)/ig, '<a href="$1">$1</a> '));
Maar ik wil dat als iemand nos.nl typt, dit ook werkt.
En bij www.nos.nl ook.
Kijk dus vooral naar het .nl en .com (rest is niet nodig).
Hoe moet die regex dan worden?
Toevoeging op 16/03/2021 06:27:51:
Je ziet in bovenstaand bericht dat www.nos.nl wél wordt omgezet naar een link, maar nos.nl niet.
Dat moet dus ook. Net als op Twitter. Maar daar kon ik het ook niet vinden in die rotzooi-broncode ;)
Handig tooltje om je te helpen regexen te schrijven, testen en begrijpen: https://regexr.com/5olfa
Zoals je ziet word alles gewoon netjes vervangen, gaat het niet ergens anders in het script fout?
Iets meer broncode kan helpen.
Overigens, de broncode van Twitter is geen rotzooitje, het is gewoon minified (gecomprimeerd) en maak waarschijnlijk gebruik van een aantal frameworks. Geen ongebruikelijke strategie maar dat maakt het wel wat lastig lezen.
(?<=\s|$)([\w.]+(.nl|.com))(?:\s|$)
Deze vangt .nl en .com domeinen met en zonder www waar geen http(s):// voor staat.
In plaats van deze replace:
<a href="$1">$1</a>
gebruik je deze:
<a href="https://$1">$1</a>
Je blijft dus nog steeds de variant gebruiken die je nu al hebt, en deze voeg je daaraan toe.
Offtopic:
Zelf even testen. Garantie tot de deur :-)
Gewijzigd op 16/03/2021 13:55:01 door Ozzie PHP
Uiteindelijke code is nu:
Code (php)
1
2
3
4
5
6
2
3
4
5
6
// zet alle URLs om in linkjes in de <p>
// Get each div
$('p.fromuser').each(function(){
// Get the content
$(this).html($(this).html().replace(/(?<=\s|$)([\w.]+(.nl|.com))(?:\s|$)/ig, '<a href="https://$1">$1</a> '));
});
// Get each div
$('p.fromuser').each(function(){
// Get the content
$(this).html($(this).html().replace(/(?<=\s|$)([\w.]+(.nl|.com))(?:\s|$)/ig, '<a href="https://$1">$1</a> '));
});
Dit doet al een heel stuk meer:
website.nl => werkt
www.website.nl => werkt
website.com => werkt
https://website.com ==> WERKT NIET
Hoe kan ik die laatste ook voor elkaar krijgen?
Regex is echt niet mijn ding, zelfs met de hulp van Thom snap ik er de ballen niet van.
Eddy E op 17/03/2021 15:27:50:
https://website.com ==> WERKT NIET
Daarom zei ik ook:
Ozzie PHP op 16/03/2021 13:53:19:
Je blijft dus nog steeds de variant gebruiken die je nu al hebt, en deze voeg je daaraan toe.
Dus:
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
// zet alle URLs om in linkjes in de <p>
// Get each div
$('p.fromuser').each(function(){
// Get the content
$(this).html($(this).html().replace(/(https?:\/\/.+?)(?:\s|$)/ig, '<a href="$1">$1</a> '));
$(this).html($(this).html().replace(/(?<=\s|$)([\w.]+(.nl|.com))(?:\s|$)/ig, '<a href="https://$1">$1</a> '));
});
// Get each div
$('p.fromuser').each(function(){
// Get the content
$(this).html($(this).html().replace(/(https?:\/\/.+?)(?:\s|$)/ig, '<a href="$1">$1</a> '));
$(this).html($(this).html().replace(/(?<=\s|$)([\w.]+(.nl|.com))(?:\s|$)/ig, '<a href="https://$1">$1</a> '));
});
Heb ze nu beide en dit werkt inderdaad prima. Bedankt.
Ik kom hier terug, want Apple's Safari-gebruikers kunnen de website niet gebruiken, want de onderste regex geeft een foutmelding in Safari.
Foutmelding
SyntaxError: Invalid regulari expression: invalid group specifier name (anonieme functie)
Gebruikte code
Code (php)
1
$(this).html($(this).html().replace(/(?<=\s|$)([\w.]+(.nl|.com))(?:\s|$)/ig, '<a href="https://$1">$1</a> '));
Als ik deze lijn weghaal werkt al het javascript wel, maar ja.
In alle andere browsers werkt bovenstaande code vlekkeloos uiteraard.