Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [JavaScript] wysukiwanie i kolorowanie słowa
mateuszpi
post 1.07.2008, 10:34:28
Post #1





Grupa: Zarejestrowani
Postów: 140
Pomógł: 0
Dołączył: 11.09.2006
Skąd: Jaworzno

Ostrzeżenie: (0%)
-----

Witam
mam kilka stron z spora ilością tekstu.
chciałbym prosić o gotowca bo o js nie mam pojęcia aby sam pisać, aby był taki bajerek:
na stronie kilka razy występuje słowo wp. chciałbym aby było ono kolorowane. tekst tej strony jest wyświetlany z bazy SQL i pod jednym wygladem pojawia się inny tekst ale zawsze słowo wp ma byc kolorowane, ma być linkiem oczywiście do www.wp.pl.

Chciałbym aby skrypt był możliwy do rozbudowy dla innych kombinacji słów-> linków,kolor

Może gdzies taki gotowiec istnieje to dajcie namiary bo nie wiem nawet zbytnio jak zabrać się za szukanie tego.

Pozdrawiam
Mateusz
Go to the top of the page
+Quote Post
batman
post 1.07.2008, 10:47:43
Post #2





Grupa: Moderatorzy
Postów: 2 921
Pomógł: 269
Dołączył: 11.08.2005
Skąd: 127.0.0.1
Przenoszę na szukam.


--------------------
I would love to change the world, but they won't give me the source code.
My software never has bugs. It just develops random features.
Go to the top of the page
+Quote Post
Shili
post 1.07.2008, 11:17:02
Post #3





Grupa: Zarejestrowani
Postów: 1 085
Pomógł: 231
Dołączył: 12.05.2008

Ostrzeżenie: (0%)
-----

Nie wiem co prawda gdzie czegoś takiego szukać, ale ze swojej strony mogę zaproponować rozwiązanie w tym stylu:
[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3. <script type="text/javascript">
  4.     function szukajTekstu()
  5.     {
  6.         tekst = /(\s)(sit)([\s\.,;:])/gi; // tekst szukany jest w drugim nawiasie , wyszukiwane są tylko pełne słowa
  7.         element = document.getElementById('tekst').innerHTML; // element w którym szukane jest słowo
  8.         link = '<a href="wp.pl" class="podmieniony_tekst1">'; // tu można zmieniać klasę linku, adres
  9.         document.getElementById('tekst').innerHTML = element.replace(tekst, '$1'+link+'$2</a>$3');
  10.  
  11.         // Jeśli chce się więcej niż jedną frazę wyszukać i pokolorować:
  12.         tekst = /(\s)(pede est)([\s\.,;:])/gi;
  13.         link = '<a href="wp.pl" style="color: purple;">' // można też kolor opisać bezpośrednio w linku, ale rozwiązanie z klasą jest lepsze
  14.         element = document.getElementById('tekst').innerHTML;
  15.         document.getElementById('tekst').innerHTML = element.replace(tekst, '$1'+link+'$2</a>$3');
  16.     }
  17. </script>
  18. <style>
  19.     /* w stylach spokojnie można zmieniać kolory, wielkości czczionek i wszystkie różne dziwne wizualne rzeczy */
  20.     .podmieniony_tekst {color: red;}
  21.     .podmieniony_tekst2 {color: purple;}
  22. </style>
  23. </head>
  24. <body onload="szukajTekstu();">
  25. <div id="tekst">
  26. Lorem ipsum dolor sit: amet, consectetuer adipiscing elit. Nam turpis. Suspendisse vel purus. Phasellus imperdiet est; Quisque lacus. Curabitur pulvinar euismod felis. Curabitur sed erat. Curabitur blandit. Donec dictum nunc non tellus. Aenean at tellus sit amet neque dapibus cursus. Suspendisse id est.
  27. <br/><br/>
  28. Vivamus mi nisl, luctus non, condimentum non, adipiscing sit amet, urna. Suspendisse porttitor, mauris ac porta facilisis, urna sapien vestibulum diam, non venenatis nisi diam et eros. Vestibulum purus erat, adipiscing vel, pulvinar ac, mattis ut, sapien. Morbi a purus ut ante dictum bibendum. Curabitur turpis lectus, tincidunt eget, hendrerit et, sagittis quis, leo. Nam interdum. Duis accumsan porttitor ligula. Aenean ut augue eget nunc tincidunt sagittis. Mauris placerat felis ut erat. Nunc pede. In gravida lorem in diam sodales mollis. Nunc auctor massa ut velit.
  29. <br/><br/>
  30. Mauris eros. Suspendisse eu justo. Pellentesque sodales ligula in ipsum. In hac habitasse platea dictumst. Vestibulum dolor metus, lacinia eu, sollicitudin in, mattis ac, orci. Maecenas scelerisque elit. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse id odio. Pellentesque accumsan. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vestibulum dignissim lorem ac orci. Donec congue. Etiam vel nisi.
  31. <br/><br/>
  32. Vivamus id justo. Aliquam pretium placerat ligula. Vivamus a ipsum in purus ultricies venenatis. Phasellus consectetuer ullamcorper urna. Aliquam tempus nisi. Vivamus eu eros ut nulla egestas elementum. Fusce ut dolor nec nisl feugiat lacinia. Curabitur id velit. Fusce eleifend, purus in ultrices porttitor, risus nisl varius metus, non vulputate pede est nec nisl. Fusce rutrum, leo vitae suscipit ornare, sapien libero pretium lorem, ullamcorper molestie nunc eros ac turpis. Phasellus gravida placerat nulla. Quisque fringilla pede. Sed vitae nisl. Etiam eu risus. Cras elit magna, fermentum vel, sagittis quis, ultrices non, ante. Vivamus arcu. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed aliquet adipiscing nibh. Praesent interdum mattis sapien. Sed sed sapien.
  33. <br/><br/>
  34. Pellentesque vel quam. Aliquam accumsan sapien congue sapien. Praesent egestas massa condimentum tellus. Nullam venenatis bibendum sem. Nam aliquet pretium mauris. Vivamus nec odio eget urna iaculis lobortis. Maecenas aliquet, leo et pulvinar eleifend, sem justo ultrices elit, ac viverra arcu dui sit amet dui. Praesent arcu dui, dapibus sed, rutrum id, luctus vitae, nisl. Nam et nibh facilisis mauris lacinia euismod. Duis ullamcorper, elit ut condimentum bibendum, augue lectus ultrices mauris, at accumsan eros turpis id elit. Aenean suscipit condimentum sapien. Vestibulum risus sapien, interdum eu, ultricies a, rutrum ac, enim. In dapibus lorem at magna. Morbi eleifend. 
  35. </div>
  36. </body>
  37. </html>
[HTML] pobierz, plaintext


Swoją drogą myślę, że lepiej byłoby to zrobić na poziomie wyświetlania z bazy przez php. Wtedy przynajmniej każdy niezależnie od ustawień przeglądarki zobaczy te linki.

Ten post edytował Shili 1.07.2008, 11:19:43
Go to the top of the page
+Quote Post
mateuszpi
post 1.07.2008, 14:07:55
Post #4





Grupa: Zarejestrowani
Postów: 140
Pomógł: 0
Dołączył: 11.09.2006
Skąd: Jaworzno

Ostrzeżenie: (0%)
-----

dzięki za pomoc. jestem w pracy to nie moge sprawdzić jak to zadziała na pełnej stronie z php ale tak na szybko w czystym html działe perfekcyjnie. napewno będzie zastosowana klasa.

co do podpięcia tego zamieniania pod php to teraz tak własnie działa. chciałbym jednak sprawdzic co jest szybsze i mniej obciążające całosć stronki.

Dzięki jeszcze raz.
Go to the top of the page
+Quote Post
« Następny starszy · Szukam · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Wersja Lo-Fi Aktualny czas: 19.07.2025 - 04:58
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn