Копировать таблицу с границами не работает в Firefox - PullRequest
1 голос
/ 11 июля 2019

Я пытаюсь скопировать таблицу, используя document.execCommand. Копирование работает, но при вставке в почтовый клиент границы и цвет фона отсутствуют. Это происходит только тогда, когда я копирую его из Firefox; Хром отлично работает.

Есть идеи, как решить эту проблему для 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>

Посмотреть на CodePen

...