Jqgrid 双击以高亮显示单元格值以进行复制

Jqgrid 双击以高亮显示单元格值以进行复制,jqgrid,jqgrid-php,Jqgrid,Jqgrid Php,我有一个jqGrid。我想突出显示一行中的一个特定单元格,ondbClickRow。这将使用户能够轻松地将单元格的值复制到剪贴板上。有人能指导我怎么做吗?谢谢 通常这是可能的,但您可能应该关闭行选择以立即看到高亮显示。因此,代码将涉及以下内容: beforeSelectRow: function () { return false; }, ondblClickRow: function (rowid, iRow, iCol, e) { $(e.target).toggleClas

我有一个jqGrid。我想突出显示一行中的一个特定单元格,ondbClickRow。这将使用户能够轻松地将单元格的值复制到剪贴板上。有人能指导我怎么做吗?谢谢

通常这是可能的,但您可能应该关闭行选择以立即看到高亮显示。因此,代码将涉及以下内容:

beforeSelectRow: function () {
    return false;
},
ondblClickRow: function (rowid, iRow, iCol, e) {
    $(e.target).toggleClass('ui-state-highlight');
}
var selectText = function (element) {
    var doc = element.ownerDocument, selection, range;
    if (doc.body.createTextRange) { // ms
        range = doc.body.createTextRange();
        range.moveToElementText(element);
        range.select();
    } else if (window.getSelection) {
        selection = window.getSelection();
        if (selection.setBaseAndExtent) { // webkit
            selection.setBaseAndExtent(element, 0, element, 1);
        } else { // moz, opera
            range = doc.createRange();
            range.selectNodeContents(element);
            selection.removeAllRanges();
            selection.addRange(range);
        }
    }
};

$("#list").jqGrid({
    // ... jqGrid options
    ondblClickRow: function (rowid, iRow, iCol, e) {
        selectText(e.target);
    }
});
因此,您可以像这样创建网格

请参阅相应的演示

已更新:如果需要选择网格单元格中的文本,您可以使用所述想法。如果在jqGrid内部使用,代码可能如下所示:

beforeSelectRow: function () {
    return false;
},
ondblClickRow: function (rowid, iRow, iCol, e) {
    $(e.target).toggleClass('ui-state-highlight');
}
var selectText = function (element) {
    var doc = element.ownerDocument, selection, range;
    if (doc.body.createTextRange) { // ms
        range = doc.body.createTextRange();
        range.moveToElementText(element);
        range.select();
    } else if (window.getSelection) {
        selection = window.getSelection();
        if (selection.setBaseAndExtent) { // webkit
            selection.setBaseAndExtent(element, 0, element, 1);
        } else { // moz, opera
            range = doc.createRange();
            range.selectNodeContents(element);
            selection.removeAllRanges();
            selection.addRange(range);
        }
    }
};

$("#list").jqGrid({
    // ... jqGrid options
    ondblClickRow: function (rowid, iRow, iCol, e) {
        selectText(e.target);
    }
});
本报告证明了这一点:


谢谢奥列格。这很接近我想要的。在示例中的“日期”列中,是否有任何方法可以选择整个日期而不以-或/分隔?我的用户将选择的列是URL。@Jai:我不明白你的意思。整个单元格上方图片的显示方式将突出显示。我尝试发布图像,但失败。请查看以下截图中2007年10月1日的数据。我希望做一个选择的副本,而不是只是突出显示的cell@Jai:突出显示单元格和选择单元格中的文本之间存在很大差异!我为您创建了新的演示(请参阅我答案的更新部分)。非常感谢。我总是觉得你对我的贡献很有价值