Lückencursor

Ermöglicht dem Benutzer das Hinzufügen eines Absatzes dort, wo das Einfügezeichen normalerweise nicht stehen kann: vor einer Tabelle ganz oben in einem Dokument oder zwischen zwei Tabellen, Regeln oder anderen Blöcken, die direkt aneinander liegen. Eine Pfeiltaste, ein Klick in die Lücke oder ein Klick auf eine blaue Hinweislinie erstellen den Absatz.

Zwei Tabellen hintereinander im Editor, in deren Lücke unter dem Mauszeiger eine blaue Linie und ein Punkt gezeichnet sind — Wenn Sie den Mauszeiger über die Grenze zwischen zwei Tabellen bewegen, wird die Hinweislinie angezeigt. Wenn Sie darauf klicken, wird dort ein leerer Absatz eingefügt.

Dieselben beiden Tabellen mit einem neuen Absatz dazwischen, der lautet: „Preise verstehen sich ohne Steuern“. — Nach dem Klick: ein Absatz zwischen den Tabellen, in den der Text eingegeben wurde.

Schalten Sie es ein

Die Funktion ist das Plugin gapcursor.js (auch in plugins/all_plugins.js). Es reicht aus, es zu laden. Es gibt keine Symbolleistenschaltfläche.

<link rel="stylesheet" href="/richtexteditor/rte_theme_default.css">
<script src="/richtexteditor/rte.js"></script>
<script src="/richtexteditor/plugins/gapcursor.js"></script>

<div id="editor"><table style="width:100%"><tbody><tr><td>Plan</td><td>Price</td></tr><tr><td>Starter</td><td>$129</td></tr></tbody></table><table style="width:100%"><tbody><tr><td>Region</td><td>Tax</td></tr><tr><td>EU</td><td>20%</td></tr></tbody></table></div>
<script>
var editor = new RichTextEditor("#editor");
</script>

Ohne das Plugin belässt in diesem Dokument „ArrowUp“ von der ersten Zelle aus die Einfügemarke in der Zelle, und „ArrowRight“ vom Ende der ersten Tabelle platziert eingegebenen Text lose zwischen den Tabellen, außerhalb jedes Absatzes.

Welche Lücken zählen

Eine Lücke wird nur dort angeboten, wo der Autor nicht weiterkommt: vor dem ersten Block, zwischen zwei Blöcken oder nach dem letzten Block, wenn der Block daneben einer von table, hr, img, figure ist. iframe, video, audio, object, embed, canvas, svg oder pre, und dort ist noch kein Absatz vorhanden. Es werden nur Blöcke direkt im Dokumentkörper überprüft. Der Editor selbst behält bereits einen leeren Absatz nach einer Tabelle am Ende des Dokuments bei, sodass sich die Lücken in der Praxis am Anfang und zwischen den Blöcken befinden.

Verwenden

Tastatur.Mit ArrowDown, ArrowRight, End oder PageDown am Ende eines solchen Blocks oder mit ArrowUp, ArrowLeft, Home oder PageUp am Anfang wird auf dieser Seite ein Absatz eingefügt. In einer Tabelle"the end"bedeutet die letzte Zeile für ArrowDown und die letzte Zelle für ArrowRight; Innerhalb des Tisches bewegen sich die Tasten wie gewohnt. Tasten mit Umschalt-, Strg-, Alt- oder Befehlstaste bleiben unverändert, sodass Auswahl- und Alt+Pfeil-Blockbewegungen davon nicht betroffen sind.
Klicken.Ein Klick auf einen leeren Editorbereich, der in eine Lücke fällt, fügt den Absatz dort ein.
Hinweis.Zwei Tabellen können sich berühren, ohne dass sich zwischen ihnen Pixel befinden. Wenn Sie den Mauszeiger innerhalb von 10 Pixeln um eine solche Grenze bewegen, wird eine blaue Linie angezeigt, und wenn Sie mit der Maus darauf klicken, wird der Absatz eingefügt.

Der neue Absatz ist<p><br></p>, also hat es Höhe und das Caret ist darin sichtbar.

Optionen und API

Option	Standard	Was es bewirkt
`gapCursorKeys`	`true`	Mit den Pfeil-, Pos1-, Ende- und Seitentasten am Blockrand wird ein Absatz eingefügt.
`gapCursorClick`	`true`	Ein Klick in eine Lücke fügt einen Absatz ein.
`gapCursorHint`	`true`	Zeigt die blaue Hinweislinie an, wenn sich der Zeiger in der Nähe einer Lücke befindet.

editor.getGapPositions()Gibt die untergeordneten Indizes zurück, an denen ein Absatz eingefügt werden kann, z. B.[0, 1]für das obige Dokument.
editor.insertParagraphAt(index)Fügt einen leeren Absatz vor dem untergeordneten Textkörper an diesem Index ein und fügt dort die Einfügemarke ein.
editor.insertParagraphBefore(element)Undeditor.insertParagraphAfter(element)Machen Sie dasselbe neben einem bestimmten Element.

Wissenswertes

Es wird nichts hinzugefügt, bis der Benutzer danach fragt, sodass ein Dokument, das mit einer Tabelle beginnt, unverändert gespeichert wird.
Die Hinweiszeile ist ein echtes Element im Bearbeitungsbereich, während sie angezeigt wird: <div class="rte-gap-hint" contenteditable="false" aria-hidden="true"></div>. Es wird entfernt, wenn sich der Zeiger an eine andere Stelle im Editor bewegt. In 2.6.12 bleibt es jedoch bestehen, wenn der Zeiger den Editor direkt aus einer Lücke verlässt, beispielsweise aus der Lücke über einer führenden Tabelle bis zur Symbolleiste, und getHTMLCode() ihn dann einschließt. Wenn Sie über eine Symbolleistenschaltfläche speichern, legen Sie gapCursorHint: false fest oder entfernen Sie div.rte-gap-hint auf dem Server.
Im Vorschlagsmodus (Änderungen verfolgen) fügt das Plugin nichts ein, da ein leerer Absatz noch nicht verfolgt werden kann.

Verwandt: Demo zur Tabellenunterstützung, Tabellensortierung und Zeilennummern.