Как можно скопировать текст из элемента div (а не из текстового поля textarea) в текстовое поле textarea при нажатии на кнопку?

Добрый вечер! <br/><br/> Я хочу добавить кнопку "Цитировать" к комментариям в блоге, которая будет извлекать текст из определенного div с id=ХХХ (где находится комментарий) и помещать его в текстовое поле textarea, предназначенное для ответа на этот комментарий. <br/><br/> Я искал информацию по этому вопросу, но так и не нашёл подходящего решения. Не могли бы вы помочь?
  • 3 апреля 2025 г. 16:25
Ответы на вопрос 2
Добрый вечер!

Для того чтобы скопировать текст из элемента `<div>` и вставить его в текстовое поле `<textarea>` при нажатии на кнопку, вам нужно использовать JavaScript. Вот пример кода, который демонстрирует, как это можно сделать.

```html
<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Цитирование комментариев</title>
    <style>
        .comment {
            border: 1px solid #ccc;
            padding: 10px;
            margin: 10px 0;
        }
    </style>
</head>
<body>

<div id="comment1" class="comment">
    Этот комментарий будет процитирован.
    <button onclick="quoteComment('comment1')">Цитировать</button>
</div>

<div id="comment2" class="comment">
    Вот еще один комментарий для цитирования.
    <button onclick="quoteComment('comment2')">Цитировать</button>
</div>

<textarea id="response" rows="4" cols="50" placeholder="Ваш ответ..."></textarea>

<script>
    function quoteComment(commentId) {
        // Получаем текст из div с заданным id
        var commentText = document.getElementById(commentId).innerText;

        // Добавляем текст в textarea
        var textarea = document.getElementById('response');
        textarea.value += `Цитата: "${commentText}"\n\n`; // добавляем текст с предварительным текстом
    }
</script>

</body>
</html>
```

### Как работает этот код:
1. У вас есть несколько `<div>`, каждый из которых представляет комментарий с кнопкой "Цитировать".
2. Когда пользователь нажимает на кнопку, вызывается функция `quoteComment()`, которая принимает `commentId` (идентификатор комментария).
3. В функции `quoteComment()`:
   - Получается текст комментария с помощью `document.getElementById(commentId).innerText`.
   - Этот текст добавляется в `<textarea>` с id `response`. Сначала добавляется префикс "Цитата: ", а затем комментарий, и в конце добавляется новый абзац.
4. Таким образом, текст из выбранного комментария будет скопирован в текстовое поле, готовый к редактированию.

Вы можете адаптировать стиль и функциональность в зависимости от ваших потребностей.
Используйте пользовательский скрипт - расширение для браузеров типа temper monkey и уже с ним. Если речь о вашем сайте - то в коде страницы добавить нужный скрипт.
Похожие вопросы