1. Diese Seite verwendet Cookies. Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies. Weitere Informationen

Text-Editor welcher contentEditable/designMode von Webkit nutzt

Dieses Thema im Forum "PHP & Co." wurde erstellt von Tekl, 18.12.08.

  1. Tekl

    Tekl Fairs Vortrefflicher

    Dabei seit:
    01.06.05
    Beiträge:
    4.622
    Hallo,

    ich meine ich hätte irgendwann mal einen Text-Editor in den Fingern gehabt, der ein Live-Vorschau von HTML-Seiten bot. Da gab's so eine Option, dass man die Seite innerhalb der Vorschau bearbeiten konnte, so wie es im Safari mit dem Attribut contentEditable/designMode möglich ist. Diese Änderungen an der Vorschau spiegelten sich dann auch gleich im Quelltext wieder, wenn ich mich recht erinnere.

    Kennt jemand diesen Editor? Ich fände den sehr praktisch, um von anderen Korrekturen durchführen zu lassen.

    Oder kennt jemand einen Weg, wie man so in Safari bearbeitete Seiten irgendwie speichern kann?

    Um den Design-Mode in Safari zu aktivieren, kann man folgendes mal in die Adresszeile von Safari kopieren und ausführen. Danach kann man den Cursor in Text setzen und lostippen.
    Code:
    javascript:document.body.contentEditable='true'; document.designMode='on'; void 0
     
    #1 Tekl, 18.12.08
    Zuletzt bearbeitet: 18.12.08
  2. Tekl

    Tekl Fairs Vortrefflicher

    Dabei seit:
    01.06.05
    Beiträge:
    4.622
    Ich habe gerade rausgefunden, dass man mit folgendem auf den geändertern Inhalt zugreifen kann:

    Code:
    javascript:alert(document.body.innerHTML)
    Weiß jemand, wie man damit ein Bookmarklet bastelt, welches den Source-Code in die Zwischenablage kopiert?
     
  3. Schomo

    Schomo Russet-Nonpareil

    Dabei seit:
    15.11.04
    Beiträge:
    3.760
    mit Safari kenn ich keinen weg, aber mit dem firefox, kannst du eine webseite laden, dann folgendes eingeben:

    javascript:document.body.contentEditable ='true'; document.designMode='on'; void 0

    dann kannst du die Seite verändern und einfach abspeichern.

    Gruß Schomo
     
  4. Tekl

    Tekl Fairs Vortrefflicher

    Dabei seit:
    01.06.05
    Beiträge:
    4.622
    In Firefox klappt das aber nicht, wenn man nur den HTML-Code speichert.

    Ich habe mir nun übergangsweise ein Bookmarklet für Safari zusammengebastelt. Da kann man den Design-Mode einschalten und mit erneutem Aufruf wieder ausschalten. Danach wird der Quellcode angezeigt.

    Code:
    javascript:(function(){ function htmlEscape(s){s=s.replace(/&/g,'&');s=s.replace(/%3E/g,'>');s=s.replace(/%3C/g,'<');return s;} if (document.designMode != 'on') {document.title = '[DESIGN-MODE] : ' + document.title; document.designMode='on'; void 0;} else {document.title = document.title.replace(/\[DESIGN-MODE\] : /,''); document.designMode='off'; x=window.open(); x.document.write('%3Cpre%3E' + htmlEscape('%3Chtml%3E\n' + document.documentElement.innerHTML + '\n%3C/html%3E')); x.document.close(); }})();
     
  5. Schomo

    Schomo Russet-Nonpareil

    Dabei seit:
    15.11.04
    Beiträge:
    3.760
    Natürlich geht das, ich hab das zwar noch nie benötigt, aber gerade mal getestet, und es ging.

    Sorry

    Gruß Schomo
     
  6. Tekl

    Tekl Fairs Vortrefflicher

    Dabei seit:
    01.06.05
    Beiträge:
    4.622
    Es geht, wenn ich samt Bilder speichere, aber das will ich nicht.
     

Diese Seite empfehlen