如何使用JavaScript复制SVG内容

时间:2017-09-08 06:59:41

标签: javascript jquery html svg

我的ASP.NET网页上有一个按钮,想要复制一个动态生成的图像作为SVG内容。 我有一个名为picutreBox的div,里面有一个名为svgBox的SVG元素

<div class="col-lg-10 col-md-10 col-sm-10 col-xs-10" id="Picturebox" style="transform-origin: 50% 50%; cursor: move; transform: none; backface-visibility: hidden;">
  <svg xmlns="http://www.w3.org/2000/svg" id="svgbox" viewBox="0 0 1087 581" preserveAspectRatio="xMinYMin meet" width="1087" height="581">
    <g id="cGrp”/>
  </svg>
</div>

现在我使用下面的Java脚本来复制SVG图像。

  function onCopy() {
    var data = document.getElementById('Picturebox').innerHTML;
    var DOMURL = window.URL || window.webkitURL || window;
    var svgBlob = new Blob([data], { type: 'image/svg+xml;charset=utf-8' });
    var url = DOMURL.createObjectURL(svgBlob);
    var image = document.createElement('img');
    image.src = url;
    document.body.appendChild(image);
    var r = document.createRange();
    r.setStartBefore(image);
    r.setEndAfter(image);
    r.selectNode(image);
    var sel = window.getSelection();
    sel.addRange(r);
    image.focus();
    var s = document.execCommand("copy");
    document.body.removeChild(image);
}

但是,虽然executeCommand返回TRUE,但图片在剪贴板中不可用。请提出您的想法

0 个答案:

没有答案