Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> Dodawanie i usuwanie edytora nicedit
Roon
post 25.06.2012, 14:52:04
Post #1





Grupa: Zarejestrowani
Postów: 9
Pomógł: 0
Dołączył: 9.08.2010

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


Witam. Skrypt poniżej działa poprawnie dla textarea jednak chciałbym aby działał dla elementów z odpowiednią klasą lub id np: <div class="edytuj"...

Nie jestem w stanie sam tego zmienić. Jeżeli byłoby to zbyt czasochłonne to mogę zapłacić za pomoc. Z góry dziękuję.

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset = "utf-8">
  5.  
  6.  
  7. <script src = "http://js.nicedit.com/nicEdit-latest.js"></script>
  8.  
  9. window.onload = function () {
  10. var body = document.body;
  11. body.addEventListener ("click", function (event) {
  12. var target = event.target;
  13.  
  14. if (target.nodeName === "TEXTAREA") {
  15. var area = new nicEditor ({fullPanel : true}).panelInstance (target);
  16.  
  17. area.addEvent ("blur", function () {
  18. this.removeInstance (target);
  19. });
  20. }
  21. }, false);
  22. }
  23. </script>
  24.  
  25. textarea {
  26. height: 100px;
  27. margin-bottom: 20px;
  28. width: 1000px;
  29. }
  30. </style>
  31. </head>
  32.  
  33. <body>
  34. </body>
  35. </html>
Go to the top of the page
+Quote Post
viking
post 25.06.2012, 15:10:30
Post #2





Grupa: Zarejestrowani
Postów: 6 378
Pomógł: 1116
Dołączył: 30.08.2006

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


Kluczem oczywiście jest linia
if (target.nodeName === "TEXTAREA")
Co byś potrzebował to wybrać elementy których atrybut ma odpowiednią klasę http://www.w3schools.com/dom/prop_attr_value.asp
Choć szybciej będzie zastosować np http://sizzlejs.com/.


--------------------
Go to the top of the page
+Quote Post
Roon
post 25.06.2012, 17:02:31
Post #3





Grupa: Zarejestrowani
Postów: 9
Pomógł: 0
Dołączył: 9.08.2010

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


Problem w tym, że nie mam pojęcia jak się za to zabrać. Na gotowca nie mam co liczyć? Zwykle zlecam wszystko co związane z js ale w tym wypadku miałem nadzieję, że ktoś mi pomoże.
Go to the top of the page
+Quote Post
kamil4u
post 25.06.2012, 17:24:48
Post #4





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

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


Cytat
if (target.nodeName === "TEXTAREA") {

->
Kod
if (target.className == "klasa") {


--edit--
Choć sam skrypt jest bardzo słabo napisany

Ten post edytował kamil4u 25.06.2012, 17:25:56


--------------------
Go to the top of the page
+Quote Post
Roon
post 25.06.2012, 17:50:08
Post #5





Grupa: Zarejestrowani
Postów: 9
Pomógł: 0
Dołączył: 9.08.2010

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


Edytor jest dodawany poprawnie ale nie jest usuwany. Jak to naprawić?
Go to the top of the page
+Quote Post
kamil4u
post 25.06.2012, 18:19:04
Post #6





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

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


Pod jaką przeglądarką? Pod Chrome wydaje się ok. Pokaż czy na pewno dobrze to zrobiłeś.


--------------------
Go to the top of the page
+Quote Post
Roon
post 25.06.2012, 18:53:37
Post #7





Grupa: Zarejestrowani
Postów: 9
Pomógł: 0
Dołączył: 9.08.2010

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


Pod chrome i firefoxem jest tak samo. Działa poprawnie w przypadku textarea o określonej klasie ale w przypadku innych elementów już nie.
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset = "utf-8">
  5.  
  6.  
  7. <script src = "http://js.nicedit.com/nicEdit-latest.js"></script>
  8.  
  9. window.onload = function () {
  10. var body = document.body;
  11. body.addEventListener ("click", function (event) {
  12. var target = event.target;
  13.  
  14. if (target.className == "klasa") {
  15. var area = new nicEditor ({fullPanel : true}).panelInstance (target);
  16.  
  17. area.addEvent ("blur", function () {
  18. this.removeInstance (target);
  19. });
  20. }
  21. }, false);
  22. }
  23. </script>
  24.  
  25. textarea {
  26. height: 100px;
  27. margin-bottom: 20px;
  28. width: 1000px;
  29. }
  30. .klasa {
  31. height: 100px;
  32. margin-bottom: 20px;
  33. width: 1000px;
  34. }
  35. </style>
  36. </head>
  37.  
  38. <body>
  39. <textarea class="klasa">text</textarea> <textarea class="klasa">text</textarea> <textarea>text2</textarea><div class="klasa">tekst</div><div class="klasa">tekst</div><p class="klasa">tekst</p>
  40. </body>
  41. </html>
Go to the top of the page
+Quote Post
kamil4u
post 25.06.2012, 19:43:23
Post #8





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

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


A jak div może mieć zdarzenie blur?

W ogóle użyj tego: http://wiki.nicedit.com/w/page/518/Editor%20Events .


--------------------
Go to the top of the page
+Quote Post
Roon
post 26.06.2012, 18:04:20
Post #9





Grupa: Zarejestrowani
Postów: 9
Pomógł: 0
Dołączył: 9.08.2010

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


Znalazłem prostszy sposób. Nie wiem tylko jak dodać id do wszystkich elementów zamiast tylko do pierwszego:
  1. document.getElementsByClassName('abc')[0].setAttribute('id', 'abe');
Go to the top of the page
+Quote Post
kamil4u
post 26.06.2012, 18:24:44
Post #10





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

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


To nie jest prostszy sposób. Użyj tego co dałem w linku.


--------------------
Go to the top of the page
+Quote Post
Roon
post 26.06.2012, 18:41:06
Post #11





Grupa: Zarejestrowani
Postów: 9
Pomógł: 0
Dołączył: 9.08.2010

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


Już sobie poradziłem ale dzięki za pomoc.

Ten post edytował Roon 26.06.2012, 19:49:59
Go to the top of the page
+Quote Post

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

 



RSS Wersja Lo-Fi Aktualny czas: 18.07.2025 - 23:09