Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript] button dodajace tresc w textarea
Forum PHP.pl > Forum > Przedszkole
skw
Chcę zrobić takie samo coś jak np tutaj na forum przy pisaniu postu, że przy naciśnięciu np na button PHP automatycznie dodaje się bbcode ([php][/php]) do pola textarea z tym, że ja chcę wpisać własną treść. W tematyce js jestem zielony więc proszę o pomoc.
thek
Musisz znać ID tego textarea i mu odpowiednio modyfikować value. Dodanie czegoś na koniec lub początek to pryszcz. Ale zrobienie tego by działał gdzieś w środku oraz jeszcze po zaznaczeniu tekstu dodawał znaczniki na koniec i początek przedziału to kolejne kilkadziesiąt linijek kodu, bo musisz to pisać dla kilku przeglądarek, bo nie działa to jednakowo. Sam takie coś już pisałem.
Kod
function putTag(field, strBefore, strAfter) {
   element = document.getElementById(field);
   element.focus();
   // IE
   if (document.selection) {
       var oRange = document.selection.createRange();
       var numLen = oRange.text.length;
       if(strBefore == "[ol][li]" || strBefore == "[ul][li]") {
       oRange.text.replaceAll("\n", "[/li][li]");
     }
       oRange.text = strBefore + oRange.text + strAfter;
       return false;
   // FF i Opera
   } else if (element.setSelectionRange) {
      var selStart = element.selectionStart, selEnd = element.selectionEnd;
            var oldScrollTop = element.scrollTop;
            if(strBefore == "[ol][li]" || strBefore == "[ul][li]") {
        oRange = element.value.substring(selStart, selEnd).replaceAll("\n", "[/li][li]");
      } else {
        oRange = element.value.substring(selStart, selEnd);
      }
      element.value = element.value.substring(0, selStart) + strBefore + oRange + strAfter + element.value.substring(selEnd);
      element.setSelectionRange(selStart + strBefore.length, selEnd + strBefore.length);
            element.scrollTop = oldScrollTop;      
      element.focus();
   } else {
            var oldScrollTop = element.scrollTop;
      element.value += strBefore + strAfter;
            element.scrollTop = oldScrollTop;      
      element.focus();
    }
}
Podajesz tagi jakie chcesz (ja robiłem wersję bezparametrową). Dodatkowo jeszcze jeśli masz kilka linijek czegoś to ujęcie ich w zakres i kliknięcie na odpowiedni guzik zrobi z tego listę, gdzie każda linijka będzie elementem listy. Jak widzisz osobno dla IE i dla reszty. Nie testowałem na webkicie tego.
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.