Ich möchte einen Textbereich von einer HTML-Seite hervorheben und die markierte Position zum Speichern von Kommentaren verwenden.Informationen über eine Textauswahl im Browser speichern
Mein Problem
Ich habe einen Artikel Seite, die dem Benutzer eine Auswahl von Text markieren können und einen Kommentar hinzufügen. Ich habe es zu einem Punkt, wo ich eine UI-Box auf der rechten Seite des ausgewählten Textes positionieren kann, um einen Kommentar einzugeben (denke Google Docs).
Ich muss Informationen über den ausgewählten Text speichern, damit ich es mit beliebigen Kommentaren verknüpfen kann. Im Idealfall würde ich nur den ausgewählten Text speichern und dann den Inhalt für diese Auswahl scannen. Dies hat einen großen Fehler: Was passiert, wenn zwei oder mehr Kopien der gleichen Textauswahl im Inhalt vorkommen.
Der Inhalt selbst ist HTML in einer DB gespeichert.
Zum Beispiel wurde eine Auswahl des folgenden Absatzes hervorgehoben (fett markierte Auswahl). Ich brauche Informationen über die Auswahl speichern zu können, um es in der Zukunft zu finden.
„Effizientes revolutionieren Interoperabilität Humankapital über virale Nischen ganzheitlich Weltklasse-Möglichkeiten durch weltweite Gemeinden ergreifen Sachlich multidisziplinären Nischen für parallel umarmen. Paradigmen. Professionell. "
Was ich bisher getan
Mit dem getBoundingClientRect() der Textauswahl range ich den Abstand vom oberen Rand der Seite bekommen. Obwohl dies für die Positionierung der UI-Kommentarbox nützlich ist, glaube ich nicht, dass dies mir helfen wird, Kommentare mit dem ausgewählten Text zu verknüpfen.
Ich kann den ausgewählten Text von window.getSelection() erhalten, aber es könnte mehrere Vorkommen geben.
Ich möchte den Inhalt NICHT ändern. d. h. drücke die Auswahl in eine span oder ähnlich, wenn ich helfen kann, als ob ein Kommentar entfernt wird, könnte es schwierig sein, sie zu entfernen, die Markup.
Das einzige Problem mit dieser Methode ist, dass 'startOffset' und' endOffset' aus dem Bereich als Teil eines Abschnitts sind. d. h. ein Absatz ist ein Abschnitt, aber auch wenn ein Absatz einen Link in der Mitte enthält, teilt er den Absatz in zwei Abschnitte auf, und so kann "startOffset" 0 sein, aber aus dem zweiten Abschnitt des zweiten Absatzes. Obwohl es keine Möglichkeit gibt, welche Abschnitte zu kennen. – iamjonesy
Verwenden Sie den gesamten Text als relativen Punkt. Ignoriere die Abschnitte. –
Es sieht so aus, als wären die bereitgestellten Offsets 'getRangeAt (0)' relativ zum 'Abschnitt' und nicht zum gesamten Text. Wenn ich das erste Wort des zweiten Absatzes hervorhebe, ist "startOffset" 0. – iamjonesy