CKEditor und iframes

Ich erlebe Sachen mit CKEditor. Ich las die doc, aber ich kann nicht einen Weg finden, zu tun, was ich versuche zu tun. (Ich bin in Java, in einer jsp Seite)CKEditor und iframes

Ich habe einen Weg

String path = request.getContextPath();

und ich brauche diesen Weg zu rufen

<%=path%>/docX/Controller

Was ich habe, ist sehr einfach:

<div id="editor"> 
    <h1>Hello world!</h1> 
</div> 
<script> 
    initSample(); 
</script>

das funktioniert sehr gut, aber ich möchte, Inhalte hinzuzufügen, wenn der pa ge laden.

Ich habe versucht, manuell einen Iframe in dem Code mit meinem Weg, wie

<iframe src="<%=path%>/docX/Controller"></iframe>

Aber es zeigt, wie diese etwas hinzufügen: http://docs.cksource.com/images/9/93/CKEditor_iframe_example1.png

Welche normal, wenn ich gut verstanden ist. Wenn ich auf "Vorschau" klicke, werde ich sehen, was ich sehen soll. Aber ich möchte es zuerst sehen und ich möchte es bearbeiten können.

Die Datei, die zurückgegeben wird, ist eine HTML-Datei. Also muss ich das 'innerHTML' aus dieser Datei holen und irgendwie in den Editor stellen. Es muss kein iframe sein, wenn es einen einfacheren Weg gibt, die Daten zu bekommen.

Jetzt versuche ich, die HTML aus dem Iframe zu bekommen und in eine <p>. Was ich so sieht weit wie folgt aus:

<% 
    String path = request.getContextPath(); 
%> 
<div class="main"> 
    <div class="grid-container"> 
     <div class="grid-width-100"> 
      <div id="editor"> 
       <h1>Hello world!</h1> 
       <iframe id="frame" src="<%=path%>/docX/Controller"></iframe> 
      </div> 
     </div> 
    </div> 
</div> 
<script> 
    initSample(); 
    var iframe = document.getElementById("frame"); 
    var iframe_contents = iframe.contentDocument.body.innerHTML; 
    alert(iframe_contents); 
</script>

Meine alert() zeigt eine leere Zeichenfolge, aber wenn ich auf Vorschau klicken, kann ich den Text sehen.

Jede Art von Hilfe wird immer geschätzt.

EDIT: Meine HTML-Datei haben nur "Test" drin. Nichts wie <head> und so. Ich habe versucht,

$(document).ready(function() { 
    var test = $("#frame").contents().find("html").html(); 
    alert(test); 
})

Aber es gibt <html></html><body></body>

EDIT 2:

habe ich es für

$(document).ready(function() { 
     var mydocument = document.getElementById("frame").contentDocument; 
     var serializer = new XMLSerializer(); 
     var content = serializer.serializeToString(mydocument); 
     alert(content); 
})

Mein Ergebnis ist: <html xmlns="http://www.w3.org/1999/xhtml"><head><style type="text/css"></style></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;"></pre></body></html>

Wenn ich meine .html öffnen Datei, alles, was ich sehe, ist test

Quelle

2016-03-24 anthomaxcool

Ich werde meine Frage beantworten, wenn jemand das gleiche Problem hat, könnte er diese Lösung versuchen.

Also entfernte ich die von meinem CKEditor und ich fügte eine leere <p>. Ich nahm einfach die zurückgegebenen Daten meiner URL und steckte sie in die <p>.

<% 
    String path = request.getContextPath(); 
%> 
<div class="main"> 
    <div class="grid-container"> 
     <div class="grid-width-100"> 
      <div id="editor"> 
       <p id="content"></p> 
      </div> 
     </div> 
    </div> 
</div> 
<script> 
    initSample(); 
    $(document).ready(function() { 
     $.get('<%=path%>/docX/Controller').then(function(responseData) { 
      $("#content").append(responseData); 
     }); 

    }) 
</script>

In meinem Fall gibt responseData "Test" zurück. Es wird auch Eigenschaften übernehmen, wenn Ihr Text zum Beispiel fett ist.

Dies wird in IE funktionieren. Aber damit es in Chrom funktioniert, wird es in meinem Fall object XMLDocument zurückgeben. Ich musste etwas tun:

$.ajax({ 
    url: '<%=path%>/docX/Controller', 
    type: 'GET', 
    dataType: 'text', 
    success: function(data){ 
     alert(data); 
    } 
});

Quelle

2016-03-29 13:38:01 anthomaxcool

Antwort

Verwandte Themen