Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Dodawanie i usuwanie edytora nicedit
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
Roon
25.06.2012, 14:52:04
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ę.

[HTML] pobierz, plaintext 
  1. <!DOCTYPE html>
  2.     <html>
  3.     <head>
  4.         <meta charset = "utf-8">
  5.  
  6.         <title></title>
  7.  
  8.         <script src = "http://js.nicedit.com/nicEdit-latest.js"></script>
  9.  
  10.         <script>
  11.             window.onload = function () {
  12.                 var body = document.body;
  13.                 body.addEventListener ("click", function (event) {
  14.                     var target = event.target;
  15.  
  16.                     if (target.nodeName === "TEXTAREA") {
  17.                         var area = new nicEditor ({fullPanel : true}).panelInstance (target);
  18.  
  19.                         area.addEvent ("blur", function () {
  20.                             this.removeInstance (target);
  21.                         });
  22.                     }
  23.                 }, false);
  24.             }
  25.         </script>
  26.  
  27.         <style>
  28.             textarea {
  29.                 height: 100px;
  30.                 margin-bottom: 20px;
  31.                 width: 1000px;
  32.             }
  33.         </style>
  34.     </head>
  35.  
  36.     <body>
  37.  <textarea>text</textarea> <textarea>text</textarea>
  38.     </body>
  39. </html>
[HTML] pobierz, plaintext
viking
25.06.2012, 15:10:30
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/.
Roon
25.06.2012, 17:02:31
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.
kamil4u
25.06.2012, 17:24:48
Cytat
if (target.nodeName === "TEXTAREA") {

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


--edit--
Choć sam skrypt jest bardzo słabo napisany
Roon
25.06.2012, 17:50:08
Edytor jest dodawany poprawnie ale nie jest usuwany. Jak to naprawić?
kamil4u
25.06.2012, 18:19:04
Pod jaką przeglądarką? Pod Chrome wydaje się ok. Pokaż czy na pewno dobrze to zrobiłeś.
Roon
25.06.2012, 18:53:37
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.
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html>
  2.     <html>
  3.     <head>
  4.     <meta charset = "utf-8">
  5.  
  6.     <title></title>
  7.  
  8.     <script src = "http://js.nicedit.com/nicEdit-latest.js"></script>
  9.  
  10.     <script>
  11.     window.onload = function () {
  12.     var body = document.body;
  13.     body.addEventListener ("click", function (event) {
  14.     var target = event.target;
  15.  
  16.    if (target.className == "klasa") {
  17.     var area = new nicEditor ({fullPanel : true}).panelInstance (target);
  18.  
  19.     area.addEvent ("blur", function () {
  20.     this.removeInstance (target);
  21.     });
  22.     }
  23.     }, false);
  24.     }
  25.     </script>
  26.  
  27.     <style>
  28.     textarea {
  29.     height: 100px;
  30.     margin-bottom: 20px;
  31.     width: 1000px;
  32.     }
  33. 	.klasa {
  34.     height: 100px;
  35.     margin-bottom: 20px;
  36.     width: 1000px;
  37.     }
  38.     </style>
  39.     </head>
  40.  
  41.     <body>
  42.     <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>
  43.     </body>
  44.     </html>
[HTML] pobierz, plaintext
kamil4u
25.06.2012, 19:43:23
A jak div może mieć zdarzenie blur?

W ogóle użyj tego: http://wiki.nicedit.com/w/page/518/Editor%20Events .
Roon
26.06.2012, 18:04:20
Znalazłem prostszy sposób. Nie wiem tylko jak dodać id do wszystkich elementów zamiast tylko do pierwszego:
[HTML] pobierz, plaintext 
  1. document.getElementsByClassName('abc')[0].setAttribute('id', 'abe');
[HTML] pobierz, plaintext
kamil4u
26.06.2012, 18:24:44
To nie jest prostszy sposób. Użyj tego co dałem w linku.
Roon
26.06.2012, 18:41:06
Już sobie poradziłem ale dzięki za pomoc.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.