texto - copy portapapeles javascript

Seleccione una tabla completa con Javascript(para copiar al portapapeles)

Question

Me preguntaba si alguien sabe cómo seleccionar usando js la tabla completa, de modo que el usuario pueda hacer clic con el botón derecho en la selección, copiarla en el portapapeles y luego pegarla en Excel. Si selecciona la tabla manualmente, el proceso funciona perfectamente. Pero a veces, si la altura de la mesa es un poco más grande que la pantalla, seleccionarla arrastrando el mouse se vuelve tediosa. Entonces, quiero darles a los usuarios la posibilidad de hacer clic en el botón "seleccionar toda la tabla" y todo está listo para copiarse.

¿Algunas ideas?

Answer 1

Lo tengo para trabajar en IE9 finalmente mediante el uso del siguiente script

NOTA: no funciona en tablas html. TIENE que ser un DIV. ¡Así que simplemente coloca un envoltorio DIV alrededor de la mesa que necesitas seleccionar!

Primero cambié el código del botón HTML un poco:

<input type="button" value="Mark table" onclick="SelectContent(''table1'');">

Luego cambió el javascript a:

function SelectContent (el) {
var elemToSelect = document.getElementById (el);
if (window.getSelection) { // all browsers, except IE before version 9
var selection = window.getSelection ();
var rangeToSelect = document.createRange ();
rangeToSelect.selectNodeContents (elemToSelect);
selection.removeAllRanges ();
selection.addRange (rangeToSelect);
}
else // Internet Explorer before version 9
if (document.body.createTextRange) { // Internet Explorer
var rangeToSelect = document.body.createTextRange ();
rangeToSelect.moveToElementText (elemToSelect);
rangeToSelect.select ();
}
else if (document.createRange && window.getSelection) {
range = document.createRange();
range.selectNodeContents(el);
sel = window.getSelection();
sel.removeAllRanges();
sel.addRange(range);
}
}

Answer 2

Sí. No es demasiado complicado, y lo siguiente funcionará en todos los navegadores mainstream (incluido IE 6 y, de hecho, 5):

(Actualizado el 7 de septiembre de 2012 después del comentario de Jukka Korpela señalando que la versión anterior no funcionaba en el modo de estándares IE 9)

Demostración: http://jsfiddle.net/timdown/hGkGp/749/

Código:

<script type="text/javascript">
function selectElementContents(el) {
var body = document.body, range, sel;
if (document.createRange && window.getSelection) {
range = document.createRange();
sel = window.getSelection();
sel.removeAllRanges();
try {
range.selectNodeContents(el);
sel.addRange(range);
} catch (e) {
range.selectNode(el);
sel.addRange(range);
}
} else if (body.createTextRange) {
range = body.createTextRange();
range.moveToElementText(el);
range.select();
}
}
</script>
<table id="tableId">
<thead>
<tr><th>Heading</th><th>Heading</th></tr>
</thead>
<tbody>
<tr><td>cell</td><td>cell</td></tr>
</tbody>
</table>
<input type="button" value="select table"
onclick="selectElementContents( document.getElementById(''tableId'') );">

Answer 3

Solo para hacer que el código propuesto por Tim Down sea más completo, permitiendo que el contenido seleccionado se copie automáticamente en el portapapeles:

<script type="text/javascript">
function selectElementContents(el) {
var body = document.body, range, sel;
if (document.createRange && window.getSelection) {
range = document.createRange();
sel = window.getSelection();
sel.removeAllRanges();
try {
range.selectNodeContents(el);
sel.addRange(range);
} catch (e) {
range.selectNode(el);
sel.addRange(range);
}
document.execCommand("copy");
} else if (body.createTextRange) {
range = body.createTextRange();
range.moveToElementText(el);
range.select();
range.execCommand("Copy");
}
}
</script>
<table id="tableId">
<thead>
<tr><th>Heading</th><th>Heading</th></tr>
</thead>
<tbody>
<tr><td>cell</td><td>cell</td></tr>
</tbody>
</table>
<input type="button" value="select table"
onclick="selectElementContents( document.getElementById(''tableId'') );">