HistoryART
@HistoryART
Надзиратель

Как заменить выделенный текст в input на дополнение к нему?

Добрый вечер. Делаю редактор, нужно при выделении заменить допустим MY TEXT на MY TEXT2, это я смог сделать, но проблема в том, что если таких фраз 2 или 3, то он берёт первое совпадение. Я не понимаю как это реализовать через getSelection и работать с самой выделенной областью. Как заменить именно выделенную фразу, а не первое совпадение?

import {url} from "../../serverConfig";
import GetTextEditor from "../lowLvlComponents/textEditor/textEditor";
import styles from '../../pages/css/articles/createArticle.module.css';
import { useState } from 'react';


export default function CreateArticle() {

    const [input, setInput] = useState();
    const [data, setData] = useState();

    return (
        <div className={styles.createArticle}>
            <div className={styles.title} onClick={() => input.value =
                input.value.replace(
                    data, `<b>${data}</b>`
                )}>Новая статья</div>
            <form action={`${url}/createArticle`}>
                <input type="text" placeholder={'Название'} onSelect={() => 
                    setData(document.getSelection().toString())
                } onClick={(e) => 
                    setInput(e.target)} onMouseDown={() => false}/>
                <input type="text" placeholder={'Ссылка на превью-картинку'} />
                <input type="text" placeholder={'Превью-текст'} />
                <GetTextEditor />
                <div className={styles.submitBox}>
                    <button>Создать</button>
                </div>
            </form>
        </div>
    )

}


Спасибо.
  • Вопрос задан
  • 64 просмотра
Пригласить эксперта
Ответы на вопрос 1
WblCHA
@WblCHA
Это не серьёзно, прямо в документации решение данной задачи есть...
https://developer.mozilla.org/ru/docs/Web/API/Sele...
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
04 дек. 2020, в 17:59
100 руб./за проект
04 дек. 2020, в 16:45
50000 руб./за проект
04 дек. 2020, в 16:41
1 руб./за проект