选择除一列之外的所有 HTML 表格答案

【问题标题】：Select all but one column of HTML table选择除一列之外的所有 HTML 表格
【发布时间】：2013-07-02 19:44:58
【问题描述】：

我正在使用以下内容在我的应用程序中选择一个表格元素，以便用户将表格拖放到 Excel 中：

$('#footer').on("click", "#exportSel", function () {
    var el = document.getElementById(curTable);
    var body = document.body, range, sel;
    if (document.createRange && window.getSelection) {
        range = document.createRange();
        var sel = window.getSelection ? window.getSelection() : document.selection;
        if (sel) {
            if (sel.removeAllRanges) {
                sel.removeAllRanges();
            } else if (sel.empty) {
                sel.empty();
            }
        }
        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();
    }
});

...一切正常。除了我的一个表在一列中有图像，我想从选择中删除这一列（或该列中的 td）。

我将“图片”td 添加到“nosel”类中，并且能够将表中不在该类中的所有 td 放入变量中：

cells = $("#" + curTable + " tr td:not(.nosel)");

然后我省略了删除或清空当前选择的代码，并尝试将每个单元格添加到选择中：

range.selectNode(cells[i]);
sel.addRange(range);

...但只有第一个 td 被选中。

那么两个问题：

这可能吗？
有没有比 addRange 更好的方法？我尝试了扩展，但没有奏效。

根据要求，这是我的表的示例：

<table class="sortable" id="resultsTable" border="1">
    <thead id="resultsHeader">
        <th>OID</th>
        <th>Image</th>
        <th>Address</th>
        <th>Parcel ID</th>
    </thead>
    <tbody id="resultsBody" data-ssimplename="results">
        <tr>
            <td>1</td>
            <td align="center" class="nosel"><img style="width: 125px;" src="http://www.vanderburghassessor.org/assessor_images/12/180/34/213/020/12-180-34-213-020-S.jpg"></td>
            <td align="center">5830 N KERTH AVE</td>
            <td align="center">82-06-04-034-213.020-020</td>
        </tr>
    </tbody>
</table>

【问题讨论】：

标签： html html-table append export-to-excel getselection

【解决方案1】：

您可以使用 jQuery 中的 .not() 函数。

$('myElements').not('myExcludedElements');

更新：

由于某种原因，JSFiddle 不会为我加载，所以它在 CodePen 中。

Example

【讨论】：

如果您能给我一个可以使用的 html 示例，我很乐意提供一个更具体的示例。
chockleyc - 谢谢你的回复。我在上面的表格中提供了一个示例。
我已经用一个例子更新了我的答案。对于我通常只在工作时检查 SO 造成的延误，我深表歉意。
看来我将不得不用我的选择功能改变一些东西来实现这一点。我看到了如何轻松获取不是“.nosel”的 td，但是我使用的选择函数选择了 table 元素，而不是 td 元素。我仍然无法将选择从一个 td 附加到另一个。不过，感谢有关.not() 的信息！

【解决方案2】：

我决定用另一种方式来解决这个问题。

我将在图像进行选择时将图像转换为 URL 字符串，而不是从选择中删除图像列：

for (i = 0; i < imgs.length; i++) {
    var urlT = $(imgs[i]).attr('src');
    $(imgs[i]).hide();
    $(imgs[i]).parent().text(urlT);
}

这样，如果实际上有人想要，图像的 URL 仍然存在。

唯一的问题是在清除选择后尝试恢复图像。我尝试添加一个 .on() 函数，但它不想正常工作：

$('body').on('click', function () {
    if ($("#" + curTable + " img:hidden").length > 0) {
        var imgs = $('#' + curTable + " img:hidden");
        for (i = 0; i < imgs.length; i++) {
            $(imgs[i]).parent().text() = '';
            imgs[i].show();
        }
    }
});

我可以处理它而不是恢复，但显然我更愿意这样做。

【讨论】：