将包含 xml 和 Json 的 kendo 网格项复制到剪贴板，并通过 javascript 格式化

Question

我遇到了一个问题，我有一个网格，其中包含一个可以包含 Json 或 XML 的项目。我需要将这些数据复制到剪贴板上。下面是我用来复制内容的代码。它基本上是设置隐藏字段的值，然后将数据从该字段复制到剪贴板。我坚持的是数据被复制为字符串，我想以正确的 JSON 格式复制它有没有办法实现这一点？我已经尝试 none 这些工作。

JSON.stringify(jsObj, null, "\t"); 

JSON.stringify(jsObj, null, 4);

下面是我的复制功能

    function CopyData(e) {
        var tr = $(e.target).closest("tr");
        var newItem = this.dataItem(tr);
        $('#ContentTypeField').val(newItem.Content);
        var copyText = document.getElementById("ContentTypeField");
        copyText.type = 'text';
        copyText.select();
        copyText.setSelectionRange(0, 99999); /*For mobile devices*/
        /* Copy the text inside the text field */
        document.execCommand("copy");
        copyText.type = 'hidden';
}

和我的网格

@(Html.Kendo().Grid<App.Models.ViewModel>()
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Bound(p => p.ID).Width(240).Hidden(true);
        columns.Bound(p => p.Name).Width(280);2
        columns.Bound(p => p.Description).Width(440);
        columns.Command(command => {command.Custom("Content").Click("CopyData"); }).Width(150);
    })
    .ToolBar(toolbar =>
    {
        toolbar.Create().Text("Add");
    })
    .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("Content.cshtml"))
     .Pageable(pager => pager
        .Input(true)
        .Numeric(true)
        .Info(true)
        .PreviousNext(true)
        .Refresh(true)
        .PageSizes(true)
      )
    .Sortable()
    .Reorderable(reorder => reorder.Columns(true))
    .Filterable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .ServerOperation(true)
        .Events(events => events.Error("error_AppSetting"))
        .Model(model =>
        {
            model.Id(p => p.ID);
            model.Field(s => s.Name);
            model.Field(s => s.Description);
        })
        .Read("Read", "App")
        .Update(c => c.Action("Update", "App"))
        .Destroy(c => c.Action("Delete", "App"))
        .Create(c => c.Action("Create", "App"))
)
)

Answer 1

我使用剪贴板 API 实现了这一点。它采用文本作为参数，因为在之前的方法中我设置了一个隐藏字段的值，然后将其复制到更改格式的剪贴板。下面是我是如何做到的代码。

    navigator.clipboard.writeText(grid.fields.Content).then(function () {
        alert('successfully copied!');
                }, 
    function () {
    alert ('Copy to clipboard failed');
});

将包含 xml 和 Json 的 kendo 网格项复制到剪贴板，并通过 javascript 格式化

Copy kendo grid item containing xml and Json to clipboard with formatting through javascript

javascript

copy

clipboarddata

kendo-grid