tinymce "codesample" -Plugin führt HTML-Tag

Ich benutze Codebeispiel-Plugin von tinymce, die hier https://www.tinymce.com/docs/plugins/codesample/ in meinem benutzerdefinierten Portal erwähnt wird.tinymce "codesample" -Plugin führt HTML-Tag

Alles funktioniert gut, bis ich die in der Datenbank gespeicherten Daten "neu bearbeiten" muss.

Wenn ich bearbeiten gehen, alle in der Datenbank gespeicherten Daten innerhalb

<pre><code>&lt;html&gt; &lt;p&gt;Text&lt;/p&gt; &lt;/html&gt; </code></pre>

wird abgezogen und als nur

<pre><code>Text </code></pre>

gezeigt, wenn sie von "Extras> Source" angesehen

Ich bin bereits verwendet "htmlentities" in meinem textarea wie: -

<textarea><?php echo htmlentities($content); ?></textarea>

Es entfernt immer noch alle HTML-Tag innerhalb des Tags von codesample Plugin verwendet.

FAQ: 1. Wenn Daten zum ersten Mal hinzugefügt werden, funktioniert alles gut. 2. Problem ist nur, wenn ich gehe, Seite zu bearbeiten. Tinymce strippt nur HTML-Code von codesample Plugin. Rest Code, der mit Codeproben wie "css, python, php" usw. hinzugefügt wurde, wird im Editor angezeigt.

Quelle

2016-08-09 John Cargo

'htmlentities' wird keine Auswirkungen auf den Text haben, die in HTML-Entitäten umgewandelt bereits wurde. Dein Problem ist wahrscheinlich woanders. – apokryfos

Wie sehen die Rohdaten in der Datenbank aus? Um festzustellen, ob sich diese Änderungen ändern, geschieht dies beim Speichern oder erneuten Aufrufen der Daten. – Martin

Es ist genau, was es in "tools> source code" von tinymce ist. –

Ok, nach viel Forschung fand ich, dass es eine Codierung Problem. Man muss jede Einheit wie folgt codieren: - <, > bis <, >.

Und & Charakter innerhalb <code> Tag &, das bedeutet < innerhalb <code></code> Tag &lt; wird.

So-Code wie folgt: -

<pre><code>&lt;html&gt; &lt;p&gt;Text&lt;/p&gt; &lt;/html&gt; </code></pre>

sollte wie sein

&lt;pre&gt;&lt;code&gt;&amp;lt;html&amp;gt; &amp;lt;p&amp;gt;Text&amp;lt;/p&amp;gt; &amp;lt;/html&amp;gt; &lt;/code&gt;&lt;/pre&gt;

Also, für alle Anwender, die Lösung zu finden sind. Dies ist die Lösung.

Denken Sie daran, & innerhalb <code> &lt; </code> Tag sollte nur in & umgewandelt werden. Hinweis< innerhalb <code> Tag ist &lt;

Prost

Quelle

2016-08-19 14:17:36

Der korrekte Weg, um Daten in Tinymce einzufügen, wäre nicht, es auszudrucken oder htmlentities zu verwenden. Betrachten Sie den folgenden Code

<div class="editor" id="editor"> 
</div> 
<script> 
    tinymce.init({ 
     selector: 'div.editor', 
     theme: 'inlite', 
     plugins: 'image table link paste contextmenu textpattern autolink', 
     insert_toolbar: 'quickimage quicktable', 
     selection_toolbar: 'bold italic | quicklink h1 h2 h3 blockquote', 
     inline: true, 
     paste_data_images: true, 
     automatic_uploads: true, 
     init_instance_callback : function(ed) { 
     // ed.setContent("<h1>Title</h1><p>Content...</p>"); 
     var xhttp = new XMLHttpRequest(); 
     xhttp.onreadystatechange = function() { 
      if (xhttp.readyState == 4 && xhttp.status == 200) { 
       ed.setContent(xhttp.responseText); 
      } 
     }; 
     xhttp.open("GET", "content.php", true); 
     xhttp.send(); 
     }, 
     content_css: [ 
     '//www.tinymce.com/css/codepen.min.css' 
     ] 
    }); 
</script>

und die Datei content.php sollte einfach nur den HTML-Inhalt an init_instance_callback

<?php 
    $content = ''; // Fetch from database 
    print $content; 
?>

Mitteilung der Funktion drucken, während i tinymce initialisieren. Das ist die Funktion, die nach dem Initialisieren von tinymce aufgerufen wird. Nun, anstatt direkt print im Editor zu verwenden, machen Sie einen Ajax-Aufruf innerhalb von init_instance_callback und rendern Sie ihn dort. Ich habe eine Beispiel-Kommentarzeile eingefügt, um Ihnen dabei zu helfen. Dies sorgt auch für die Sicherheitsvalidierung (keine Ausführung des Skript-Tags, falls vorhanden).

auch zugleich den Inhalt des Editors zu bekommen, während es zu Datenbank gespeichert ist

var content = tinyMCE.get('editor').getContent();

Und dann können Sie eine Ajax-Post-Anforderung machen Daten in der Datenbank zu speichern.

Jetzt warum ich Ajax benutze, ist wichtig. Ich habe viele andere Methoden ausprobiert, bei denen ich direkt drucken konnte. Dies führt jedoch zu einer Sicherheitslücke, da Skript-Tags vor der Initialisierung des Editors ausgeführt werden können.

Ich habe div in diesem Beispiel verwendet, aber es wäre egal für Textbereich. Verwenden Sie nicht htmlentities, da dies dem HTML-Inhalt entgehen würde und Sie möchten, dass der Inhalt in tinymce gerendert wird und nicht in der maskierten Version.

Quelle

2016-08-14 04:55:54 georoot

Ich habe früher versucht, die Instanz Rückruf, aber ich versuche dies nach dem Speichern von Daten im AJAX-Modus. –

Es gibt "Ungültiger oder unerwarteter Token-Fehler" aufgrund von Inhalten in mehreren Zeilen - wie kann das vermieden werden? –

@JohnCargo können Sie einige Schnipsel posten, damit ich besser helfen kann :) – georoot

Verwenden setContent Funktion den Inhalt hinzufügen, sobald TinyMCE geladen wird:

setup: function (editor) { 
    editor.on('init', function() { 
    var theContent = '<pre><code>&lt;html&gt; &lt;p&gt;Text&lt;/p&gt; &lt;/html&gt; </code></pre>'; 
    this.setContent(theContent); 
    }); 
}

Quelle: Tags Get Removed When Using Codesample Plugin with TinyMCE

Quelle

2016-08-18 10:39:23

nicht sicher, warum dies markiert wurde, ist es ein gültiger Ansatz :) – georoot

tinymce "codesample" -Plugin führt HTML-Tag

Antwort

Verwandte Themen