Jak domyślnie zrobić pastę Tinymce w postaci zwykłego tekstu

103

Przeszukałem go tysiące razy. Nikt nie podaje kompletnego rozwiązania, jak domyślnie wkleić Tinymce jako zwykły tekst i usunąć formatowanie bez klikania przycisku „wklej jako tekst”.

Jakieś pomysły, jak to zrealizować? lub jak automatycznie włączyć przycisk „wklej jako tekst”?

Dziękuję Ci

Ryan
źródło

Odpowiedzi:

59

EDYCJA: to rozwiązanie jest dla wersji 3.x, dla wersji 4.x przeczytaj odpowiedź od @Paulo Neves

Problem polega na tym, że wtyczka Paste automatycznie resetuje zwykły tekst wklejany przy każdym wklejaniu. Więc wszystko, co musimy zrobić - cofnij to. Poniższy kod powinien pomóc.

tinyMCE.init({
...
oninit : "setPlainText",
plugins : "paste"

....
});

Definicja setPlainText

 function setPlainText() {
        var ed = tinyMCE.get('elm1');

        ed.pasteAsPlainText = true;  

        //adding handlers crossbrowser
        if (tinymce.isOpera || /Firefox\/2/.test(navigator.userAgent)) {
            ed.onKeyDown.add(function (ed, e) {
                if (((tinymce.isMac ? e.metaKey : e.ctrlKey) && e.keyCode == 86) || (e.shiftKey && e.keyCode == 45))
                    ed.pasteAsPlainText = true;
            });
        } else {            
            ed.onPaste.addToTop(function (ed, e) {
                ed.pasteAsPlainText = true;
            });
        }
    }

Więc teraz zawsze będzie jasne.

er-v
źródło
Myślę, że to z powodu braku wtyczki wklejania, który stworzyłem działający przykład - spójrz na 92.248.232.12/tinymce/examples/simple.html tinyMCE.init ({... oninit: "setPlainText", plugins: "paste" .. ..});
er-v
5
Świetna odpowiedź, chociaż zauważyłem, że dostaję błędy JS związane z definicją „ed”. Było to łatwe do naprawienia poprzez usunięcie linii tinyMCE.get ("elm1") i umieszczenie ed jako pierwszego parametru metody setPlainText: np. "Function setPlainText (ed) {...".
drmonkeyninja
8
W późniejszych wersjach tinymce dodano kilka opcji, aby się tym zająć. paste_text_sticky_default: trueiw paste_text_sticky: truetwojej konfiguracji powinno załatwić sprawę. (Używam 3.5.0.1)
Greg,
@ er-v wszelkie sugestie, jak zachować sformatowany ciąg tinyMCE za pomocą formularza: stackoverflow.com/questions/17247900/ ...
codeObserver
13
Właśnie wypróbowałem .init({ plugins: ["paste"], paste_as_text: true })i działa jak urok z TinyMCE 4.1, bez potrzeby dodatkowej funkcji.
Rémi Breton
149

W przypadku tinyMCE 3X lub 4X sytuacja trochę się zmieniła. teraz możesz to zrobić i działa dobrze.

tinymce.init({
    plugins: "paste",
    paste_as_text: true
});
Paulo Almeida
źródło
5
Tak, inne podejścia nie zadziałały, ale to działa.
Tim
2
@Tim Podejście pokazane w odpowiedzi na to pytanie jest specyficzne dla TinyMCE 3.x. Jeśli używasz TinyMCE 4 lub większego, podejście opisane w tej odpowiedzi będzie wystarczające.
Leonardo Czarnogóra
W TinyMCE jest wtyczka lub opcja dla prawie wszystkiego ... nic dziwnego, że jest najlepsza!
supersan
1
Dziękuję za rozwiązanie, ale to faktycznie oznacza, że ​​muszę pamiętać o edytowaniu pliku konfiguracyjnego za każdym razem, gdy wtyczki są aktualizowane?
Mike
84

Rozwiązałem ten problem za pomocą tego kodu

tinyMCE.init({
...
plugins : "paste",
paste_text_sticky : true,
setup : function(ed) {
    ed.onInit.add(function(ed) {
      ed.pasteAsPlainText = true;
    });
  }
....
})
Dariusz Lyson
źródło
11
Na ile to warte, myślę, że twoje rozwiązanie jest lepsze niż wybrana odpowiedź.
arikfr
@Dariusz Lyson, czy masz jakieś sugestie, jak zachować ciąg w formacie tinyMCE za pomocą formularza? : stackoverflow.com/questions/17247900/…
codeObserver
9
Otrzymuję błąd javascript, którego onInitwłaściwość edjest niezdefiniowana. Unable to get property 'add' of undefined or null reference
Tim
35

Właśnie natknąłem się na to i odkryłem, że od TinyMCE 3.4.2 możesz po prostu:

paste_text_sticky: true,
paste_text_sticky_default: true

... co było miłe.

stovroz
źródło
2
+1 dla tych opcji konfiguracyjnych, nie zapomnij dodać wtyczki wklejania do tablicy wtyczek!
Fredszaq
3
Edytor nadal zezwala na wklejanie innego niż zwykły tekst, gdy używam tego podejścia.
Tim
7

Myślę, że najłatwiej byłoby to:

tinymce.init({
   ...
   paste_as_text: true,
   plugins: "paste",
   ...
});
bracia 28
źródło
1

Czy nie lepiej jest użyć:

var ed = tinyMCE.activeEditor;

zamiast:

var ed = tinyMCE.get('elm1');
Asen Mitov
źródło
Zgadzam się, udało mi się sprawić, by mój skrypt działał przy użyciu activeEditor zamiast get ('elm1'), w odpowiedzi zamieściłem również twój kod + kod zaakceptowany jako odpowiedź i działa świetnie
GibboK
To jest komentarz skierowany ER-V za odpowiedź . To nie daje odpowiedzi na pytanie. Gdy zdobędziesz wystarczającą reputację , będziesz mógł komentować każdy post .
Wszyscy pracownicy są niezbędni
1

FYI, TinyMCE poprawiło to, implementując to jako domyślną opcję we wtyczce wklejania. Więcej informacji: http://www.tinymce.com/wiki.php/Plugin:paste

Jednak nadal nie jest doskonały. Oto skrypt, który również wyłącza cały HTML:

// Paste
        paste_auto_cleanup_on_paste : true,
        paste_remove_spans: true,
        paste_remove_styles: true,
        paste_retain_style_properties: false,

        paste_preprocess : function(pl, o) 
        {    // Replace <div> with <p>
            o.content = o.content.replace(/<div>/gi, "<p>");    
            o.content = o.content.replace(/<\/div>/gi, "</p>");
            o.content = o.content.replace(/<\r\n/gi, "\n");
            o.content = o.content.replace(/<\n\n/gi, "\n");
            o.content = o.content.replace(/<\n\n/gi, "\n");

            // Replace empty styles
            o.content = o.content.replace(/<style><\/style>/gi, "");    

            o.wordContent = true;            
        },

        paste_postprocess : function(pl, o) 
        {    //console.log(o.node.innerHTML);
            var ed = pl.editor, dom = ed.dom;

            // Remove all tags which are not <p> or <br>
            tinymce.each(dom.select('*', o.node), function(el) 
            {    if (el.tagName.toLowerCase() != "p" && el.tagName.toLowerCase() != "br") 
                {    dom.remove(el, 1); // 1 = KeepChildren
                    console.log(el.tagName);
                }
                dom.setAttrib(el, 'style', '');
            });

        },

Źródło: http://www.tinymce.com/forum/viewtopic.php?pid=60121#p60121

laarsk
źródło
1

Bez wtyczki: Posłuchaj, aby wkleić wydarzenie, pobierz dane ze schowka

Jeśli nie możesz lub nie chcesz używać wtyczki z jakiegokolwiek powodu, możesz utworzyć własną funkcję zwrotną „wklej jako zwykły tekst” w następujący sposób:

tinyMCE.init({

    // ...,

    setup: function (editor) {

        // Listen for paste event, add "Paste as plain text" callback
        editor.onPaste.add(function (editor, e) {

            // Prevent default paste behavior
            e.preventDefault();

            // Check for clipboard data in various places for cross-browser compatibility.
            // Get that data as text.
            var content = ((e.originalEvent || e).clipboardData || window.clipboardData).getData('Text');

            // Let TinyMCE do the heavy lifting for inserting that content into the editor.
            editor.execCommand('mceInsertContent', false, content);
        });
    }
});

Uwaga: to zostało utworzone dla TinyMCE 3.5.x. Kompatybilność może się różnić w zależności od wersji.

gfullam
źródło
1
Doskonałe rozwiązanie dla 3.x - żadna z pozostałych odpowiedzi nie działała w moim przypadku
Rolf Pedro Ernst
1

jeśli używasz pliku .yml, dodaj wtyczkę pasteipaste_as_text: true

default:
  plugins:
    - paste
  paste_as_text: true
LifterCoder
źródło
-1

Nie jestem pewien, czy jest to możliwe, ponieważ „wklej jako zwykły tekst” faktycznie usuwa tekst przed dodaniem go do okna. Jeśli po prostu wkleisz dane do okna, nie można wykonać żadnych operacji. (Chyba że podłączyłeś się doonChange czy czegoś), ale mogą skończyć się naprawieniem kodu, który został już wklejony, a tym samym `` podwójnym naprawieniem '' go.

Mitch Dempsey
źródło
-1

Zrobiłem co następuje:

var pastePlainText = function() {
    // No need to pass in an ID, instead fetch the first tinyMCE instance
    var ed = tinyMCE.get(0); 
    ed.pasteAsPlainText = true;  

    //adding handlers crossbrowser
    if (tinymce.isOpera || /Firefox\/2/.test(navigator.userAgent)) {
        ed.onKeyDown.add(function (ed, e) {
            if (((tinymce.isMac ? e.metaKey : e.ctrlKey) && e.keyCode == 86) || (e.shiftKey && e.keyCode == 45))
                ed.pasteAsPlainText = true;
        });
    } else {            
        ed.onPaste.addToTop(function (ed, e) {
            ed.pasteAsPlainText = true;
        });
    }
};

I wtedy:

tinyMCE.init({
    // ...
    plugins: "paste",
    oninit: pastePlainText // Note, without "
    // ...
})
Helge
źródło