Chciałbym podświetlić zakres tekstu ze strony html i uzyskać podświetloną pozycję, aby następnie użyć do przechowywania komentarzy.Przechowywanie informacji o zaznaczeniu tekstu w przeglądarce
Mój problem
Mam na stronie artykułu, który pozwala użytkownikowi na wybór podświetlić tekst i dodać komentarz. Mam to do punktu, w którym mogę umieścić pole interfejsu użytkownika na prawo od zaznaczonego tekstu, aby wprowadzić komentarz (pomyśl o google docs).
Potrzebuję przechowywać informacje o zaznaczonym tekście, aby móc je połączyć z dowolnymi komentarzami. Idealnie byłoby po prostu zapisać wybrany tekst, a następnie zeskanować zawartość dla tego wyboru. Ma to poważną wadę: co się stanie, jeśli dwie lub więcej kopii tego samego wyboru tekstu wystąpi w treści.
Sama treść jest przechowywana w formacie HTML w DB.
Na przykład podświetlony został wybór poniższego akapitu (pogrubiony wybór). Muszę do przechowywania informacji o wyborze, aby móc odnaleźć go w przyszłości.
„Skutecznie zrewolucjonizuje interoperacyjne kapitał ludzki poprzez nisz wirusowych Holisticly wykorzystać potencjalne możliwości światowej klasy przez społeczności na całym świecie Obiektywnie objąć multidyscyplinarnych nisze do siebie równoległe. paradygmaty.
Co robiłem dotychczas
Używanie getBoundingClientRect()
zaznaczenia tekstu range
można uzyskać odległość od górnej części strony. Chociaż przydatne do pozycjonowania pola komentarza interfejsu użytkownika nie sądzę, że to pomoże mi połączyć komentarze do ich zaznaczonego tekstu.
Mogę pobrać zaznaczony tekst z window.getSelection()
, ale może być wiele wystąpień.
NIE chciałbym modyfikować zawartości. tj. zawijam zaznaczenie w span
lub podobnym, jeśli mogę pomóc, tak jakby komentarz został usunięty, może to być trudne do usunięcia znaczników.
Jedyny problem z tą metodą polega na tym, że 'startOffset' i' endOffset' z zakresu są częścią sekcji. tj. akapit będzie sekcją, ale także jeśli akapit zawiera łącze pośrodku, dzieli ten akapit na dwie sekcje, więc 'startOffset' może być 0, ale z 2. sekcji drugiego akapitu. Chociaż nie ma sposobu, aby dowiedzieć się, które sekcje. – iamjonesy
Użyj całego tekstu jako względnego punktu. Zignoruj sekcje. –
Wygląda na to, że przesunięcia pod warunkiem, że 'getRangeAt (0)' odnoszą się do 'sekcji', a nie do całego tekstu. Jeśli podkreślę pierwsze słowo drugiego akapitu, "startOffset" to 0. – iamjonesy