Select html table

Select HTML table with jQuery

by jstenkvist

HTML

<TABLE style="BORDER-TOP: #000000 1px solid; BORDER-RIGHT: #000000 1px solid; WIDTH: 559px; BORDER-BOTTOM: #000000 1px solid; BORDER-LEFT: #000000 1px solid" cellSpacing=0 cellPadding=0 border=0><THEAD>
<TR>
<TD>
<TABLE cellSpacing=0 cellPadding=0 border=0>
<TBODY>
<TR>
<TD class=head style="FONT-SIZE: 11px; FONT-FAMILY: Arial; VERTICAL-ALIGN: bottom; BORDER-BOTTOM: #000000 1px solid; TEXT-ALIGN: left; PADDING-LEFT: 4px; BACKGROUND-COLOR: #ffffc0; font-color: " width=56>Följesedel</TD>
<TD class=head style="FONT-SIZE: 11px; FONT-FAMILY: Arial; VERTICAL-ALIGN: bottom; BORDER-BOTTOM: #000000 1px solid; TEXT-ALIGN: left; PADDING-LEFT: 4px; BACKGROUND-COLOR: #ffffc0; font-color: " width=86>Leveransdatum</TD>
<TD class=head style="FONT-SIZE: 11px; FONT-FAMILY: Arial; VERTICAL-ALIGN: bottom; BORDER-BOTTOM: #000000 1px solid; TEXT-ALIGN: left; PADDING-LEFT: 4px; BACKGROUND-COLOR: #ffffc0; font-color: " width=276>Komponent</TD>
<TD class=head style="FONT-SIZE: 11px; FONT-FAMILY: Arial; VERTICAL-ALIGN: bottom; BORDER-BOTTOM: #000000 1px solid; TEXT-ALIGN: left; PADDING-LEFT: 4px; BACKGROUND-COLOR: #ffffc0; font-color: " width=46>Prislista</TD>
<TD class=head style="FONT-SIZE: 11px; FONT-FAMILY: Arial; VERTICAL-ALIGN: bottom; BORDER-BOTTOM: #000000 1px solid; TEXT-ALIGN: left; PADDING-LEFT: 4px; BACKGROUND-COLOR: #ffffc0; font-color: " width=56>Belopp</TD>
<TD style="BORDER-BOTTOM: #000000 1px solid; BACKGROUND-COLOR: #ffffc0; font-color: #FFFFC0"></TD></TR></TBODY></TABLE></TD></TR></THEAD>
<TBODY>
<TR>
<TD>
<DIV onfocus="tableFirstLineFocus('tblHaulierInvoiceDetails')" onblur=tableRemoveFocus() id=grid_tblHaulierInvoiceDetails style="OVERFLOW: auto; HEIGHT: 251px; TEXT-ALIGN: left; Z-INDEX: 1000; BACKGROUND-COLOR: #ffffff" name="grid_tblHaulierInvoiceDetails" helpid="30397">
<TABLE dataSrc=#tblHaulierInvoiceDetails_system_grid_xmldata id=tblHaulierInvoiceDetails_DataTable cellSpacing=0 cellPadding=0 border=0>
<TBODY>
<TR...

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();
    }
}

function clearSelection() {
    var sel;
    if ( (sel = document.selection) && sel.empty ) {
        sel.empty();
    } else {
        if (window.getSelection) {
            window.getSelection().removeAllRanges();
        }
        var activeEl = document.activeElement;
        if (activeEl) {
            var tagName = activeEl.nodeName.toLowerCase();
            if ( tagName == "textarea" || (tagName == "input" && activeEl.type == "text") ) {
                // Collapse the selection to the end
                activeEl.selectionStart = activeEl.selectionEnd;
            }
        }
    }
}

$( "table" ).contextmenu(function() {
  selectElementContents( this );
  window.setTimeout(clearSelection, 5000);
});