Задача. Есть рутинная задача копировать текст из одного html-документа и вставлять в определенне поля на сайте. Каждый раз неудобно выделять и нажимать Ctrl+C, когда этих строк тысячи.
Решение. Можно использовать JavaScript для облегчения этой задачи. Необходимо сделать так, чтобы по клику на строку копировалось в буфер обмена ее содержимое (текст). Естественно, нужно использовать какую-то программу из менеджеров буфера обмена (например ClipX), чтобы за раз проклацать несколько строк и можно было переходить на другую вкладку куда мы переносим текст и уже там вставляем как нужно из буфера обмена.
Решение копированя текста по клику реализуется на JavaScript с использованием JQuery. Используем Код №1. Естественно свой html-документ нужно подготовить (если данные на рабочем сайте, то можно сохранить на компьютер html-страницу и работать с ней), чтобы каждая копируемая строка (текст) находилась в каком-то теге.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
|
="http://code.jquery.com/jquery-latest.min.js" type="text/javascript">
let activeClassEl;
$(document).on('click', function(e) {
console.log(e.target.innerHTML)
var $tmp = $("");
$("body").append($tmp);
$tmp.val($(e.target).text()).select();
document.execCommand("copy");
$tmp.remove();
// Здесь назначаем элементу на который кликнули класс active
if (activeClassEl){
$(activeClassEl).removeClass('active');
}
$(e.target).addClass('active');
activeClassEl = e.target;
});
|
—
$(document).on('click', functio... — цепляем функцию на событие клика.— console.log(e.target.innerHTML) — чтобы можно было в консоли браузера быстро увидеть что копируется.— Блок if (activeClassEl){... ...activeClassEl = e.target; — назначаем элементу на котрый кликаем класс «active», прописав в стилях для него например background красного цвета. Чтобы было видно на каком элементе мы остановились.
