Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [JavaScript] Tagowanie tekstu w textarea
Print_Screen
post 5.06.2012, 22:24:58
Post #1





Grupa: Zarejestrowani
Postów: 23
Pomógł: 0
Dołączył: 25.02.2012

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

Chciałbym wstawić na stronę najprostszy button, który otaguje mi zaznaczone słowo w htmlowym textarea.

Zaznaczam wyraz, klikam na ów przycisk i robi się <tag>wyraz</tag>.

Nie znam javascriptu, więc w zasadzie proszę o gotowy wzór, który przerobiłbym na różne tagi, bo zasada z pewnością jest ta sama dla pogrubiania, podkreślania etc.

Ten post edytował Print_Screen 5.06.2012, 22:26:50
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi (1 - 6)
IProSoft
post 5.06.2012, 23:28:31
Post #2





Grupa: Zarejestrowani
Postów: 479
Pomógł: 97
Dołączył: 6.09.2011
Skąd: php.net :)

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

Nie ten dział: Gotowe rozwiązania
https://www.google.pl/search?q=bbcode+gotowy+skrypt


--------------------
Manual prawdę Ci powie.
Go to the top of the page
+Quote Post
Print_Screen
post 6.06.2012, 00:40:12
Post #3





Grupa: Zarejestrowani
Postów: 23
Pomógł: 0
Dołączył: 25.02.2012

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

Nie da się w javascripcie?

Nie buduję forum internetowego. Najlepiej, gdyby nie musiało działać po stronie serwera.
Go to the top of the page
+Quote Post
mccd
post 6.06.2012, 00:48:53
Post #4





Grupa: Zarejestrowani
Postów: 58
Pomógł: 12
Dołączył: 14.01.2011

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

Tu masz gotowca z JQuery.
http://jsfiddle.net/43gqC/1/

Ten post edytował mccd 6.06.2012, 00:58:26
Go to the top of the page
+Quote Post
Print_Screen
post 6.06.2012, 20:13:55
Post #5





Grupa: Zarejestrowani
Postów: 23
Pomógł: 0
Dołączył: 25.02.2012

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

Wielkie dzięki! Oto mi chodziło! Poniższy kod uzyskany dzięki zlinkowanej stronie ładnie działa.

[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3. <title>Title</title>
  4. <meta http-equiv="Content-type" content="text/html; charset=utf-8">
  5. </head>
  6. <body>
  7.  
  8. <script type="text/javascript"
  9.  src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"></script>
  10.  
  11. <textarea id='text'>
  12. Ala ma kota, a kot ma Alę.
  13. </textarea><br/>
  14.  
  15. <button type="button" id='tag'>Tag</button>
  16.  
  17. <script type="text/javascript"><!--
  18. function wrapText(elementID, openTag, closeTag) {
  19.     var textArea = $('#' + elementID);
  20.     var len = textArea.val().length;
  21.     var start = textArea[0].selectionStart;
  22.     var end = textArea[0].selectionEnd;
  23.     var selectedText = textArea.val().substring(start, end);
  24.     var replacement = openTag + selectedText + closeTag;
  25.     textArea.val(textArea.val().substring(0, start) + replacement + textArea.val().substring(end, len));
  26. }
  27. $('#tag').click(function(){
  28.     wrapText("text", "<tag>", "</tag>");
  29. });
  30. //--></script>
  31. </body>
  32. </html> 
[HTML] pobierz, plaintext


Czy dałoby się może jakoś poprzestawiać te komendy tak, żeby dorobić opcję odwracającą ostatnie zmiany? (przycisk cofnij).
Go to the top of the page
+Quote Post
mccd
post 7.06.2012, 17:15:58
Post #6





Grupa: Zarejestrowani
Postów: 58
Pomógł: 12
Dołączył: 14.01.2011

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

http://jsfiddle.net/43gqC/2/

W tym skrypcie możesz cofnąć ostatnią zmianę, żeby móc cofać więcej wstecz, musiałbyś zapisywać wartość textarea po każdej zmianie np. do tablicy.
Go to the top of the page
+Quote Post
Print_Screen
post 13.06.2012, 17:30:44
Post #7





Grupa: Zarejestrowani
Postów: 23
Pomógł: 0
Dołączył: 25.02.2012

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

Wielkie dzięki!

Odświeżam temat, bo napotkałem mały problem. Otóż funkcja działa tylko z polem o nazwie text. Jeśli są dwa pola o nazwie text, to działa z tym pierwszym.

Czy możliwe jest by działało to na wszystkich polach w dokumencie? Czy też każde pole tekstowe musiałoby mieć swoje przyciski do tagowania?
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · 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: Przełącz na: Standardowy · 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: 18.07.2025 - 04:21
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn