Aizstāt URL ar linku HTML'ā

daGrevis · December 2, 2009

Sveiki,

Ar JS neesmu nekādos draugos, šo skriptu atradu šajā - http://stackoverflow.com/questions/37684/replace-url-with-html-links-javascript - lapā. Pēc manām domām vajadzētu būt tā, ka lapā ir kāds links, piemēram "http://google.com/", un skripts to automātiski aizstāj ar "<a href="http://google.com/">http://google.com/</a>"... :) Tikai nestrādā. :(

http://dagrevis.net/problems/replace-links/

rATRIJS · December 2, 2009

Nu to funkciju vajag arī palaist...

2easy · December 2, 2009

njā ar funkcijas nodefinēšanu tiešām ir par maz. vajag arī palaist :D

iekopē šo kodu aiz tās funkcijas un refrešo ;)

window.onload = function() {document.body.innerHTML = replaceURLWithHTMLLinks(document.body.innerHTML);};

Edited December 2, 2009 by 2easy

daGrevis · December 2, 2009

Paldies par palīdzību... :)

Pie reizes. Kā lai izveido tā, ka ja tiek atrasti noteikti vārdi, piemēram, "google.lv", "php.lv" un / vai "ebay.com", tad tos ar JS aizstāj šādi...

"google.lv" = "<a href="http://google.lv/">google.lv</a>"

"php.lv" = "<a href="http://php.lv/">php.lv</a>"

"ebay.com" = "<a href="http://ebay.com/">ebay.com</a>"

Paldies.

Edited December 2, 2009 by daGrevis

2easy · December 2, 2009

function replaceURLWithHTMLLinks(text) {
   var exp = /(\b(https?|ftp|file):\/\/([-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|]))/i;
   return text.replace(exp,"<a href='$1'>$3</a>"); 
}

daGrevis · December 2, 2009

function replaceURLWithHTMLLinks(text) {
   var exp = /(\b(https?|ftp|file):\/\/([-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|]))/i;
   return text.replace(exp,"<a href='$1'>$3</a>"); 
}

Kā nu tas panāktu manu rezultātu? Nevaru saprast... :(

2easy · December 2, 2009

... nju ko lai saka

aizvieto iepriekšējo kodu ar šo...

ko tad vēl?

Edited December 2, 2009 by 2easy

daGrevis · December 2, 2009

... nju ko lai saka

aizvieto iepriekšējo kodu ar šo...

ko tad vēl?

Liels, liels paldies. Cepums Tev! :) Sākumā domāju, ka Tu esi ko sajaucis, jo kods bija ļoti līdzīgs tam pirmajam, bet tagad sapratu... :) Paldies. :)

Ņā, tikai tas neatrisina manu problēmu... Itkā sākumā ir definēts ka "google.lv" kā teksts == pārvēršas par "google.lv" ar linku uz "http://google.lv". Tas ir iespējams? :)

Edited December 2, 2009 by daGrevis

2easy · December 2, 2009

šī funkcija NAV vispārīga, bet pašos vienkāršākajos gadījumos tā strādā ;)

cerams, tev pietiks atjautības izdomāt, kā to lietot...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
<script type="text/javascript">

function uri2lnk(s) {
var s2, aM;
s = s.replace(/\b(?:https?|ftp|file):\/\/([a-z0-9-\/?&=#%+@~_|!:,.;]*[a-z0-9-\/&=#%+@~_|])/ig, '<a href="$&">$1</a>');
s2 = s.replace(/<a[^>]*>.+?<\/a>/ig, "");
while (aM = /\b[a-z][a-z0-9-]*\.[a-z]{2,3}/ig.exec(s2)) s = s.replace(aM[0], '<a href="http://' + aM[0] + '">' + aM[0] + "</a>");
return s;
}
function ouri2lnk(sId) {
var o = document.getElementById(sId);
o.innerHTML = uri2lnk(o.innerHTML);
}
window.onload = function () {ouri2lnk("content");};

</script>
</head><body>

lalala domain.lv lalala domain2.lv lalala http://domain3.lv asdf://domain4.lv lalala <span>http://domain5.lv/path/?p=123</span> lalala<br />un te ir arī google.lv, php.lv un ebay.com<br /><br />
<div id="content">lalala domain.lv lalala domain2.lv lalala http://domain3.lv asdf://domain4.lv lalala <span>http://domain5.lv/path/?p=123</span> lalala<br />un te ir arī google.lv, php.lv un ebay.com</div>

</body></html>

mad182 · December 5, 2009

2easy: pamēģini, kas notiks, ja tekstā iekļausi vasja.pupkins@gmail.com :)

Edited December 5, 2009 by mad182

2easy · December 5, 2009

hehe, tas jau ir ārpus tiem vienkāršajiem gadījumiem ^^

taču to can easy fix

ty anyway (for "bugreport"). vai mb tas ir new feature request? :D:D:D

update... (pēc complete redesign)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
<script type="text/javascript">

function uri2lnk(s) {
var PN_URL = /\b[a-z]+:\/\/([a-z0-9-._~!*()':/?&=+;,$@#%]+)/ig;
var PN_EMAIL = /\b[a-z0-9-._]+@[a-z0-9-._]+\.[a-z]{2,3}\b/ig;
var PN_DOMAIN = /\b[a-z0-9-._]+\.[a-z]{2,3}\b/ig;
var aUrl = [], aEmail = [], s2 = s, aM, iId = 0, i;

while (aM = PN_URL.exec(s)) {
	aUrl.push([iId, aM]);
	s2 = s2.replace(aM[0], "%id:" + iId++ + "%");
}
while (aM = PN_EMAIL.exec(s)) {
	aEmail.push([iId, aM]);
	s2 = s2.replace(aM[0], "%id:" + iId++ + "%");
}

s2 = s2.replace(PN_DOMAIN, '<a href="http://$&">$&</a>');
for (i = 0; i < aUrl.length; i++) s2 = s2.replace("%id:" + aUrl[i][0] + "%", '<a href="' + aUrl[i][1][0] + '">' + aUrl[i][1][1] + "</a>");
for (i = 0; i < aEmail.length; i++) s2 = s2.replace("%id:" + aEmail[i][0] + "%", '<a href="mailto:' + aEmail[i][1][0] + '">' + aEmail[i][1][0] + "</a>");
return s2;
}
function ouri2lnk(sId) {
var o = document.getElementById(sId);
o.innerHTML = uri2lnk(o.innerHTML);
}
window.onload = function() {ouri2lnk("content");};

</script>
</head><body>

asdf.ghjk@domain.lv lalala asdf.ghjk@sub.domain.lv lalala domain.lv lalala sub.domain.lv lalala domain2.lv lalala http://domain3.lv lalala asdf://domain4.lv lalala <span>http://domain5.lv/path/?p=123</span> lalala<br />un te ir arī google.lv, php.lv un ebay.com<br /><br />
<div id="content">asdf.ghjk@domain.lv lalala asdf.ghjk@sub.domain.lv lalala domain.lv lalala sub.domain.lv lalala domain2.lv lalala http://domain3.lv lalala asdf://domain4.lv lalala <span>http://domain5.lv/path/?p=123</span> lalala<br />un te ir arī google.lv, php.lv un ebay.com</div>

</body></html>

daGrevis · December 5, 2009

Ļoti jauki... :) Bet ko es darīšu, ja saita nosaukums būs nevis google.lv, bet gan IceFrog??

Es domāju ka sākumā vajag kaut kā definet, ka ja ir IceFrog, tad tas ir "http://icefrog.com/". Ceru uz turpmāku palīdzību, 2easy. :)

2easy · December 5, 2009

apetīte rodas ēdot...

mefisto · December 5, 2009

Tieši kāpēc tev vajag izmanto JS priekš tādām perversijām ?

Vai nebūtu 1000-reiz vieglāk to izdarīt servera pusē ar preg_replace ?

2easy · December 6, 2009

mefisto, ar ko servera pusē būtu vienkāršāk? algoritms jau no tā nemainās! ok, es uzrakstītu php funkciju function uri2lnk($s) {...}, un vienīgā atšķirība būtu sintaksē!

ja js ir

s2 = s2.replace(PN_DOMAIN, '<a href="http://$&">$&</a>');

tad php ekvivalents ir

$s2 = preg_replace(PN_DOMAIN, '<a href="http://\0">\0</a>', $s2);

kas te ir 1000-reiz vieglāk? php variantā šim fragmentam pat vairāk koda sanāk! :D:D:D

labi jau labi, tev ir taisnība, ka šāda apstrāde normāli notiek uz servera ;) bet mēs jau nezinām, kādam webam daGrevis grib lietot to skriptu

attiecībā uz pēdējo daGrevis jautājumu. nju man liekas, ka tas jau paliek pārāk triviāli. tad tiešām ir jābūt 0 zināšanām par javascript, lai kko tādu paprasītu...

s2 = s2.replace("IceFrog", '<a href="http://icefrog.com">IceFrog</a>');

mefisto · December 6, 2009

daGrevis , vai tu maz apzinies ko tas tavs skripts izdarītu īstā lapā ?

http://dagrevis.net/problems/replace-links/

Pirmkārt tu sagrautu visu DOM koku. Nevienscits, pirms tam pievienotais, js events

vairs nedarbotos un tie kuri bija pievienoti, sāktu veidot memory-leak.

Tā kā tas tavs skripts nostrādā pie document.window.onload() , vispirms lapa ielādētos (ar visām bildem un flašu),

un tad tā lādētos pa jaunu, jo tu būtu pārrakstījis HTMLu.

Un protams, ka tu izmanto visbremzīgāko veidu kāds vien ir iespējams.

Kauna nav ?

Sign In

Aizstāt URL ar linku HTML'ā

Question

Link to comment

Share on other sites

19 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation