Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Replace text on-the-fly 1

Status
Not open for further replies.
berkshirea

berkshirea

Technical User
Mar 22, 2009
97
0
0
GB
hi guys, can you give me some ideas?

suppose i have a page with the following text:

"Singapore, officially the Republic of Singapore, is an island country off the southern tip of the Malay Peninsula, 137 kilometres (85 mi) north of the equator, in the Southeast Asian region of the Asian continent. It is separated from Malaysia by the Straits of Johor to its north, and from Indonesia's Riau Islands by the Singapore Strait to its south. Singapore is the world's fourth leading financial centre[11] and a cosmopolitan world city, playing a key role in international trade and finance...."

and i want it to show and replace dynamically as the page loads every instance of Singapore, Malaysia, Indonesia, Malay Peninsula with a hyperlink to their specific page.

sample links:
Singapore, Malaysia, Indonesia, Malay Peninsula,
can you please give me some ideas guys? thanks


,
 
Sort by date Sort by votes
Ideas:

1. A server side language replace before loading the page.
or
2. A regular Expression replace on the text by accessing the element that holds the text.



Code: 
var link_singapore="<a href='[URL unfurl="true"]http://www.Singapore.com'>Singapore</a>";[/URL]
str.replace(/singapore/gi, link_singapore);
...


----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
Upvote 0 Downvote
hi vacunita,

thanks for your reply but i am not sure how to implement your code. is it ok if you could show me how to incorporate that in a page?

thanks very much again.
 
Upvote 0 Downvote
Since I don't know what your page looks like its hard to say, but as an example:
Code: 
<html>
<head>
<title></title>
</head>
<body>
<div id="mytext">
Singapore, officially the Republic of Singapore, is an island country off the southern tip of the Malay Peninsula, 137 kilometres (85 mi) north of the equator, in the Southeast Asian region of the Asian continent. It is separated from Malaysia  by the Straits of Johor to its north, and from Indonesia's Riau Islands by the Singapore Strait to its south. Singapore is the world's fourth leading financial centre[11]  and a cosmopolitan world city, playing a key role in international trade and finance....
</div>
</body>
</html>

And you want to replace the places with the links:

Code: 
[gray]
<html>
<head>
<title></title>
[red]<script type="text/javascript">
function replace_links(){
var links=new Array();
links[0]="<a href='[URL unfurl="true"]http://www.Singapore.com'>Singapore</a>";[/URL]
links[1]="<a href='[URL unfurl="true"]http://www.Malaysia.com'>Malaysia</a>";[/URL]
...

var thetext=document.getElementById('mytext');
thetext.innerHTML.replace(/singapore/gi, links[0]);
thetext.innerHTML.replace(/malaysia/gi, links[1]);
}
</script>[/red]
</head>
<body [red]onLoad="replace_links();[/red]>
<div id="mytext">
Singapore, officially the Republic of Singapore, is an island country off the southern tip of the Malay Peninsula, 137 kilometres (85 mi) north of the equator, in the Southeast Asian region of the Asian continent. It is separated from Malaysia  by the Straits of Johor to its north, and from Indonesia's Riau Islands by the Singapore Strait to its south. Singapore is the world's fourth leading financial centre[11]  and a cosmopolitan world city, playing a key role in international trade and finance....
</div>
</body>
</html>
[/gray]

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
Upvote 0 Downvote
hi vacunita, thanks for that code but i can't seem to make it to show/replace the text with a hyperlink.
 
Upvote 0 Downvote
Although the java script example should work this is a requirement that would be better suited to a server side solution.
performing the search & replace serverside would ensure the feature worked for all useres including those whose borwsers do not support java script or have java script switched off.


I do not Have A.D.D. im just easily, Hey look a Squirrel!
 
Upvote 0 Downvote
Sorry, I typed that straight into the reply box, and had a few typos. I also hoped you removed the "..." before trying to run it as that would have caused some errors.

This should now work.
Code: 
<html>
<head>
<title></title>
<script type="text/javascript">
function replace_links(){
var links=new Array();
links[0]="<a href='[URL unfurl="true"]http://www.Singapore.com'>Singapore</a>";[/URL]
links[1]="<a href='[URL unfurl="true"]http://www.Malaysia.com'>Malaysia</a>";[/URL]
...
var thetext=document.getElementById('mytext');
var reps="";
alert(thetext.innerHTML);
thetext.innerHTML=thetext.innerHTML.replace(/singapore/gi, links[0]);
thetext.innerHTML=thetext.innerHTML.replace(/malaysia/gi, links[1]);
...
}
</script>
</head>
<body onload="replace_links();">
<div id="mytext">
Singapore, officially the Republic of Singapore, is an island country off the southern tip 

of the Malay Peninsula, 137 kilometres (85 mi) north of the equator, in the Southeast Asian 

region of the Asian continent. It is separated from Malaysia  by the Straits of Johor to 

its north, and from Indonesia's Riau Islands by the Singapore Strait to its south. 

Singapore is the world's fourth leading financial centre[11]  and a cosmopolitan world 

city, playing a key role in international trade and finance....
</div>
</body>
</html>



----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
Upvote 0 Downvote

hi vacunita that is AWESOME!

thanks a lot for your help!
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

Kennelbloke
  • Locked
  • Question
Can't Get Markers to show on Map
Replies
0
Views
299
Kennelbloke
Kennelbloke
jomat
  • Locked
  • Question
JS to show the timer in html under title instead of in the status bar
Replies
2
Views
276
xwb
xwb
malpa
  • Locked
  • Question
Graph the selection of a html table row
Replies
0
Views
257
malpa
malpa
rogerte
  • Locked
  • Question
Code that works on Windows, Android and Iphone
Replies
0
Views
217
rogerte
rogerte
JScannell
  • Locked
  • Question
Javascript issue on iPhone/iMac platforms
Replies
0
Views
228
JScannell
JScannell

Part and Inventory Search

Sponsor

Back
Top