-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathcopiar-input-o-texto-a-portapapeles.js
52 lines (43 loc) · 2.28 KB
/
copiar-input-o-texto-a-portapapeles.js
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
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
//Usa JQuery, si tu proyecto no lo usa descomenta el siguiente comentario
//<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
/*ESTE CÓDIGO USA EL ONCLICK DE LA SIGUIENTE MANERA*/
/*onclick="copiarTexto(this)"*/
/*onclick="copiarTextoConSaltoDeLinea(this)"*/
//Aquí un ejemplo de código html
//<button id="id-button" name="name-button" class="class-button" style="background: #f2f2f2;color:black;border: none;padding: 10px;border-radius: 5px;box-shadow: 0px 0px 3px #0044;" onclick="copiarTexto(this)" value="value-button">Botón</button>
//Es para testo simple sin salto de linea
function copiarTexto(objeto) {
//Aquí establecemos qué datos usaremos, este esta pensado para un onclick cambia el this por '#id-del-objeto' para hacerlo dinámico
let id = $(objeto).attr('id');
let texto = $(objeto).text();
let name = $(objeto).attr('name');
let value = $(objeto).val();
//Se establece lo que se va a copiar
let valorCopiado = id+' '+name+' '+value;
//Se realiza el copiado
let aux = document.createElement("input");
aux.setAttribute("value", valorCopiado);
document.body.appendChild(aux);
aux.select();
document.execCommand("copy");
document.body.removeChild(aux);
}
//Es para texto con salto de linea
function copiarTextoConSaltoDeLinea(objeto) {
//En caso de que uses un elemento que de por sí tiene saltos de línea como un parrafo o un textarea descomenta lo siguiente
$(objeto).text(($(objeto).text().replace("<br>", "\n")));
$(objeto).text(($(objeto).text().replace("/<br>", "\n")));
$(objeto).val(($(objeto).val().replace("<br>", "\n")));
$(objeto).val(($(objeto).val().replace("/<br>", "\n")));
//Aquí establecemos qué datos usaremos, este esta pensado para un onclick cambia el this por '#id-del-objeto' para hacerlo dinámico
let id = $(objeto).attr('id');
let texto = $(objeto).text();
let name = $(objeto).attr('name');
let value = $(objeto).val();
//Se establece lo que se va a copiar
let valorCopiado = 'Id: '+id+'\nNombre: '+name+'\nValor: '+value;
//Se establece lo que se va a copiar
element = $('<textarea>').appendTo('body').val(valorCopiado).select();
document.execCommand('copy');
element.remove();
}