Ich versuche, ein Lernwerkzeug für eine Seite zu erstellen, mit dem ein Benutzer einen beliebigen Text auf der Seite auswählen und auf eine Schaltfläche klicken kann. Dieser Klick formatiert dann den ausgewählten Text mit einem gelben Hintergrund. Ich kann dies innerhalb eines einzelnen Tags realisieren, aber wenn sich der Auswahlbereich über mehrere Tags erstreckt (z. B. das erste LI in einer ungeordneten Liste zusammen mit der Hälfte des zweiten), habe ich Schwierigkeiten, den Stil anzuwenden. Ich kann nicht nur die Auswahl mit einer Spanne hier leider einpacken.
Grundsätzlich möchte ich die Effekte, die mit contentEditable
y execCommand
ohne dass etwas auf der Seite bearbeitet werden kann, außer dass dem ausgewählten Text mit einem Klick auf eine Schaltfläche eine Hintergrundfarbe zugewiesen wird.
Ich bin offen für jQuery-Lösungen, und fand dieses Plug-in die das Erstellen von Bereichen in verschiedenen Browsern zu vereinfachen scheint, aber ich konnte damit keine Formatierung auf den ausgewählten Bereich anwenden. Ich kann von der Konsole sehen, dass es auf die Auswahl abholt, aber mit etwas wie:
var selected = $().selectedText();
$(selected).css("background-color","yellow");
hat keine Wirkung.
Für jede Hilfe, die mich in die richtige Richtung führt, wäre ich sehr dankbar.