带边框的复制表在Firefox中不起作用

时间:2019-07-10 22:57:45

标签: javascript html css firefox execcommand

我正在尝试使用document.execCommand复制表。复制有效,但是在粘贴电子邮件客户端时缺少边框和背景色。仅当我从Firefox复制它时,才会发生这种情况。 Chrome可以正常运行。

是否有关于如何在没有外部插件的情况下为Firefox解决此问题的想法,并且没有为现有表使用内联样式?

function selectElementContents() {
  var el = document.getElementById('div1');
  // Copy textarea, pre, div, etc.
  var range = document.createRange();
  range.selectNodeContents(el);
  var sel = window.getSelection();
  sel.removeAllRanges();
  sel.addRange(range);
  try {
    var successful = document.execCommand('copy');
    var msg = successful ? 'successful' : 'unsuccessful';
    console.log('Copy command was ' + msg);
  } catch (err) {
    console.log('Oops, unable to copy');
  }

} // end function selectElementContents(el)
.table {
  background-color: #faa835;
  border: 2px solid black;
  border-collapse: collapse;
}

.table th {
  border: 2px solid black
}

.table td {
  border: 2px solid black
}
<button id="copy" onclick="selectElementContents()">Copy</button>
<div id="div1">
  <table class="table">
    <tr>
      <th>Not working table</th>
      <th>1</th>
      <th>2</th>
      <th>3</th>
      <th>4</th>
    </tr>
    <tr>
      <td>Not working table</td>
      <td>1</td>
      <td>2</td>
      <td>3</td>
      <td>4</td>
    </tr>
  </table>
</div>

View on CodePen

0 个答案:

没有答案