Питання Як скопіювати в буфер обміну в JavaScript?


Який найкращий спосіб копіювати текст до буфера обміну? (багатокористувацький браузер)

Я намагався:

function copyToClipboard(text) {
    if (window.clipboardData) { // Internet Explorer
        window.clipboardData.setData("Text", text);
    } else {  
        unsafeWindow.netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");  
        const clipboardHelper = Components.classes["@mozilla.org/widget/clipboardhelper;1"].getService(Components.interfaces.nsIClipboardHelper);  
        clipboardHelper.copyString(text);
    }
}

але в Internet Explorer виникає синтаксична помилка. У Firefox це говорить unsafeWindow is not defined.

Хороший трюк без спалаху: Як Trello має доступ до буфер обміну?


2670
2017-12-30 13:09


походження


Нічого особливого. Вони можуть це зробити самостійно, але я хочу запропонувати також можливість натискання кнопки, не турбуючись про вибір правильної частини тексту. - Santiago Corredoira
можливий дублікат Покладіть текст в буфер обміну з FireFox, Safari і Chrome - GvS
Цей довгий пост в блозі містить багато способів зробити це: Доступ до системного буфера обміну з JavaScript - Святий Грааль? - Aaron Digulla
Це дає необмежений виняток браузера в IE та FF - Jagadeesh
Якщо ми можемо помістити текст в буфер обміну користувача, ми можемо зруйнувати його буфер обміну. - Frank Fang


Відповіді:


Огляд

Існує 3 основних API для копіювання в буфер обміну:

  1. API асинхронного буфера обміну  [navigator.clipboard.writeText]
    • Текстова частина доступна в Chrome 66 (березень 2018 р.)
    • Доступ асинхронний і використовується JavaScript обіцянки, може бути написаний так, що підказки користувача безпеки (якщо вони відображаються) не переривають JavaScript на сторінці.
    • Текст можна скопіювати в буфер обміну безпосередньо з змінної.
    • Підтримується лише на сторінках, що надсилаються через HTTPS.
    • У Chrome 66 сторінок на активних вкладках можна написати в буфер обміну без запиту на отримання дозволів.
  2. document.execCommand('copy')
    • Більшість браузерів підтримують цю функцію з ~ квітня 2015 року (див. Нижче Підтримка браузера).
    • Доступ є синхронним, тобто припиняє роботу JavaScript на сторінці, доки не буде завершено, включаючи відображення та взаємодію користувачів із будь-якими вказівками щодо безпеки.
    • Текст читається з DOM і поміщається в буфер обміну.
    • Під час тестування ~ квітня 2015 року лише браузер Internet Explorer був помічений під час відображення запитів на дозвіл під час написання в буфер обміну.
  3. Перевизначення події копії
    • Докладніше про документацію API в буфер обміну Перевизначення події копії.
    • Дозволяє змінювати те, що відображаються в буфер обміну з будь-якої події копії, може містити інші формати даних, крім звичайного тексту.
    • Тут не розглядається, оскільки він прямо не відповідає на питання.

Загальні зауваження

Не чекайте, що команди, пов'язані з буфером обміну, працюватимуть під час тестування коду в консолі. Як правило, сторінка повинна бути активною (API-інтерфейс Async Clipboard API) або вимагає взаємодії з користувачем (наприклад, кліком користувача), щоб дозволити (document.execCommand('copy')), щоб отримати доступ до буфер обміну, див. нижче, щоб отримати докладнішу інформацію.

Async + Fallback

Через рівень підтримку браузера для нового API буфера обміну Async ви, швидше за все, захочете повернутися до document.execCommand('copy') спосіб отримати гарне охоплення браузера.

Ось простий приклад:

function fallbackCopyTextToClipboard(text) {
  var textArea = document.createElement("textarea");
  textArea.value = text;
  document.body.appendChild(textArea);
  textArea.focus();
  textArea.select();

  try {
    var successful = document.execCommand('copy');
    var msg = successful ? 'successful' : 'unsuccessful';
    console.log('Fallback: Copying text command was ' + msg);
  } catch (err) {
    console.error('Fallback: Oops, unable to copy', err);
  }

  document.body.removeChild(textArea);
}
function copyTextToClipboard(text) {
  if (!navigator.clipboard) {
    fallbackCopyTextToClipboard(text);
    return;
  }
  navigator.clipboard.writeText(text).then(function() {
    console.log('Async: Copying to clipboard was successful!');
  }, function(err) {
    console.error('Async: Could not copy text: ', err);
  });
}

var copyBobBtn = document.querySelector('.js-copy-bob-btn'),
  copyJaneBtn = document.querySelector('.js-copy-jane-btn');

copyBobBtn.addEventListener('click', function(event) {
  copyTextToClipboard('Bob');
});


copyJaneBtn.addEventListener('click', function(event) {
  copyTextToClipboard('Jane');
});
<div style="display:inline-block; vertical-align:top;">
  <button class="js-copy-bob-btn">Set clipboard to BOB</button><br /><br />
  <button class="js-copy-jane-btn">Set clipboard to JANE</button>
</div>
<div style="display:inline-block;">
  <textarea class="js-test-textarea" cols="35" rows="4">Try pasting into here to see what you have on your clipboard:
  
  </textarea>
</div>

Зверніть увагу, що цей фрагмент не працює належним чином у вбудованому попередньому перегляді StackOverflow, який можна спробувати тут: https://codepen.io/DeanMarkTaylor/pen/RMRaJX?editors=1011

API асинхронного буфера обміну

Зверніть увагу, що існує можливість запитувати дозвіл і перевірити доступ до буфера обміну через API дозволів у Chrome 66.

var text = "Example text to appear on clipboard";
navigator.clipboard.writeText(text).then(function() {
  console.log('Async: Copying to clipboard was successful!');
}, function(err) {
  console.error('Async: Could not copy text: ', err);
});

document.execCommand ('copy')

Решта цього повідомлення потрапляє в нюанси та деталі document.execCommand('copy') API

Підтримка браузера

JavaScript document.execCommand('copy') підтримка зросла, перегляньте посилання нижче для оновлень браузера:

Простий приклад

var copyTextareaBtn = document.querySelector('.js-textareacopybtn');

copyTextareaBtn.addEventListener('click', function(event) {
  var copyTextarea = document.querySelector('.js-copytextarea');
  copyTextarea.focus();
  copyTextarea.select();

  try {
    var successful = document.execCommand('copy');
    var msg = successful ? 'successful' : 'unsuccessful';
    console.log('Copying text command was ' + msg);
  } catch (err) {
    console.log('Oops, unable to copy');
  }
});
<p>
  <button class="js-textareacopybtn" style="vertical-align:top;">Copy Textarea</button>
  <textarea class="js-copytextarea">Hello I'm some text</textarea>
</p>

Комплексний приклад: скопіювати в буфер обміну без відображення введення

Наведений вище простий приклад чудово працює, якщо є textarea або input елемент, видимий на екрані.

У деяких випадках ви можете скопіювати текст до буфера обміну без відображення input / textarea елемент Ось один з прикладів способу обійти це (в основному вставити елемент, скопіювати в буфер обміну, видалити елемент):

Перевірено Google Chrome 44, Firefox 42.0a1 та IE 11.0.8600.17814.

function copyTextToClipboard(text) {
  var textArea = document.createElement("textarea");

  //
  // *** This styling is an extra step which is likely not required. ***
  //
  // Why is it here? To ensure:
  // 1. the element is able to have focus and selection.
  // 2. if element was to flash render it has minimal visual impact.
  // 3. less flakyness with selection and copying which **might** occur if
  //    the textarea element is not visible.
  //
  // The likelihood is the element won't even render, not even a flash,
  // so some of these are just precautions. However in IE the element
  // is visible whilst the popup box asking the user for permission for
  // the web page to copy to the clipboard.
  //

  // Place in top-left corner of screen regardless of scroll position.
  textArea.style.position = 'fixed';
  textArea.style.top = 0;
  textArea.style.left = 0;

  // Ensure it has a small width and height. Setting to 1px / 1em
  // doesn't work as this gives a negative w/h on some browsers.
  textArea.style.width = '2em';
  textArea.style.height = '2em';

  // We don't need padding, reducing the size if it does flash render.
  textArea.style.padding = 0;

  // Clean up any borders.
  textArea.style.border = 'none';
  textArea.style.outline = 'none';
  textArea.style.boxShadow = 'none';

  // Avoid flash of white box if rendered for any reason.
  textArea.style.background = 'transparent';


  textArea.value = text;

  document.body.appendChild(textArea);
  textArea.focus();
  textArea.select();

  try {
    var successful = document.execCommand('copy');
    var msg = successful ? 'successful' : 'unsuccessful';
    console.log('Copying text command was ' + msg);
  } catch (err) {
    console.log('Oops, unable to copy');
  }

  document.body.removeChild(textArea);
}


var copyBobBtn = document.querySelector('.js-copy-bob-btn'),
  copyJaneBtn = document.querySelector('.js-copy-jane-btn');

copyBobBtn.addEventListener('click', function(event) {
  copyTextToClipboard('Bob');
});


copyJaneBtn.addEventListener('click', function(event) {
  copyTextToClipboard('Jane');
});
<div style="display:inline-block; vertical-align:top;">
  <button class="js-copy-bob-btn">Set clipboard to BOB</button><br /><br />
  <button class="js-copy-jane-btn">Set clipboard to JANE</button>
</div>
<div style="display:inline-block;">
  <textarea class="js-test-textarea" cols="35" rows="4">Try pasting into here to see what you have on your clipboard:
  
  </textarea>
</div>

Додаткові нотатки

Працює тільки тоді, коли користувач виконує дію

Все document.execCommand('copy') дзвінки повинні відбуватися як прямий результат дії користувача, наприклад, натисніть обробник подій. Це запобігає пошкодженню буфера обміну користувачами, коли вони цього не очікують.

Див Google Developers розміщують тут для отримання додаткової інформації.

API буфера обміну

Зверніть увагу на повну специфікацію API-інтерфейсу буфера обміну можна тут: https://w3c.github.io/clipboard-apis/

Чи підтримується це?

  • document.queryCommandSupported('copy') повинен повернутися true якщо команда "підтримується браузером".
  • і document.queryCommandEnabled('copy') повернутися true якщо document.execCommand('copy') буде успішним, якщо кликати зараз. Перевірка, щоб забезпечити, щоб команда була викликана з ініціативи користувача, і інші вимоги.

Однак, як приклад проблеми сумісності браузера, Google Chrome від ~ квітня до жовтня 2015 року лише повернувся true від document.queryCommandSupported('copy') якщо команда була викликана з ініціативи користувача потоку.

Зверніть увагу на подробиці сумісності нижче.

Подробиці сумісності браузера

Поки простий заклик до document.execCommand('copy') загорнутий в try/catch Блок, викликаний в результаті натискання користувача, отримає вам найбільшу сумісність. Використовуйте таке:

Будь-який дзвінок до document.execCommand, document.queryCommandSupported або document.queryCommandEnabled повинна бути загорнута в a try/catch блок

Різні реалії браузера та версії браузера виводять різні типи виключень, коли вони викликаються, а не повертаються false.

Різні реалії браузера все ще перебувають у потоці та в API буфера обміну все ще знаходиться в проекті, тому не забувайте робити тестування.


1593
2018-06-12 18:56



як копіювати безпосередньо з змінної інформації. ee .: var str = "word"; ? - jscripter
@BubuDaba Створення манекена приховано <textarea> з JS, додати його до document.body, встановіть його значення на змінну та використовуйте її в темпі copyTextarea, потім видаліть його відразу після копіювання вмісту. - SeinopSys
Чи є що-небудь для Safari чи будь-яких індикаторів, які він буде застосовувати в Safari? - www139
@AyaSalama ключовим моментом є те, що дія "копіювання" не може відбутися, якщо користувач не приймає дію в браузері. Користувач не зможе виконати дію, якщо елемент стилізовано з "display: none", оскільки він не зможе його бачити, а також взаємодіятиме з ним. - Dean Taylor
Чи працює ця програма на iPhone Safari для когось? - SB2055


Автоматичне копіювання в буфер обміну може бути небезпечним, тому більшість браузерів (окрім IE) ускладнюють його. Особисто я використовую такий простий трюк:

function copyToClipboard(text) {
  window.prompt("Copy to clipboard: Ctrl+C, Enter", text);
}

Користувачеві представлено поле для запрошення, де вже буде вибрано текст для копіювання. Тепер досить натиснути Ctrl+С і Введіть (щоб закрити коробку) - і вуаля!

Тепер операція копіювання буфера обміну є безпечною, оскільки користувач робить це вручну (але досить простий спосіб). Звичайно, працює у всіх браузерах.

<button id="demo" onclick="copyToClipboard(document.getElementById('demo').innerHTML)">This is what I want to copy</button>

<script>
  function copyToClipboard(text) {
    window.prompt("Copy to clipboard: Ctrl+C, Enter", text);
  }
</script>


1195
2018-05-19 08:06



Красивий трюк - але пам'ятайте це Cmd-C для Mac - Casebash
Розумний, але це підтримує лише одну лінію. - Aram Kocharyan
Необхідно змінити функцію "швидка" на спеціальний модуль, м'ясо фокусу полягає в тому, щоб використовувати поле редагованого вмісту та попередньо вибрати текст, і що воно не порушує інтерфейс користувача браузера, забезпечуючи, що користувач приймає самі дії A ++ - Jon z
все ще не використовує javascript для копіювання в буфер обміну ^ _ ^ - RozzA
Дивно, що це отримує 457 апветитів, поки воно не відповідає на питання: скопіювати в буфер обміну в Javascript! - stevenvh


Наступний підхід працює в Chrome, Firefox, Internet Explorer та Edge, а також в останніх версіях Safari (підтримка копіювання була додана в версії 10, яка була випущена в жовтні 2016 року).

  • Створіть текстове поле та встановіть його вміст на текст, який ви хочете скопіювати в буфер обміну.
  • Додайте текстову область до DOM.
  • Виділіть текст у текстовому полі.
  • Викличте document.execCommand ("копіювати")
  • Вилучіть текстове поле з домену.

Примітка: ви не побачите текстове поле, оскільки воно буде додано та вилучено в межах того самого синхронного виклику коду Javascript.

Деякі речі, які потрібно стежити, якщо ви самі реалізуєте це:

  • З міркувань безпеки це можна викликати тільки з обробника події, наприклад, клацання (так само, як і у випадку відкриття вікна).
  • IE відобразить діалогове вікно дозволу, коли вперше буде оновлено буфер обміну.
  • IE та Edge прокручуються, коли текстове поле фокусується.
  • execCommand () може викинути в деяких випадках.
  • Нові лінії та вкладки можна проковтнути, якщо ви не використовуєте текстове поле. (Більшість статей, як видається, рекомендують використовувати розділ div)
  • Текстова область буде видно, коли відобразиться діалогове вікно IE, або його потрібно сховати, або скористатися спеціальною адресою clipboardData api для IE.
  • У системних адміністраторів системи IE можуть вимкнути API буфера обміну.

Функція нижче повинна максимально точно виконувати всі наступні питання. Будь ласка, залиште коментар, якщо ви знайдете якісь проблеми або у вас є будь-які пропозиції щодо його вдосконалення.

// Copies a string to the clipboard. Must be called from within an 
// event handler such as click. May return false if it failed, but
// this is not always possible. Browser support for Chrome 43+, 
// Firefox 42+, Safari 10+, Edge and IE 10+.
// IE: The clipboard feature may be disabled by an administrator. By
// default a prompt is shown the first time the clipboard is 
// used (per session).
function copyToClipboard(text) {
    if (window.clipboardData && window.clipboardData.setData) {
        // IE specific code path to prevent textarea being shown while dialog is visible.
        return clipboardData.setData("Text", text); 

    } else if (document.queryCommandSupported && document.queryCommandSupported("copy")) {
        var textarea = document.createElement("textarea");
        textarea.textContent = text;
        textarea.style.position = "fixed";  // Prevent scrolling to bottom of page in MS Edge.
        document.body.appendChild(textarea);
        textarea.select();
        try {
            return document.execCommand("copy");  // Security exception may be thrown by some browsers.
        } catch (ex) {
            console.warn("Copy to clipboard failed.", ex);
            return false;
        } finally {
            document.body.removeChild(textarea);
        }
    }
}

https://jsfiddle.net/fx6a6n6x/


196
2017-11-26 00:03



Відмінна відповідь: підтримка крос-браузера, обробка помилок + очищення. З сьогоднішньої нової підтримки для запитуCommandSupported, копіювання в буфер обміну тепер реалізовано в Javascript, і це повинно бути прийнятою відповіддю, а не незграбним "window.prompt" ("Копіювати в буфер обміну: Ctrl + C, Enter", text) "Обхід. window.clipboardData підтримується в IE9, так що ви повинні додати IE9 в список підтримки браузера, і я думаю, можливо, IE8 і попередній теж, але потрібно перевірити. - user627283
Так. IE 8/9 повинен бути в порядку. Наша програма не підтримує їх. Так що я не протестував. IE зупиняє підтримку в січні, тому я не надто жорсткий. Будемо сподіватися, що підтримка Safari скоро приземнеться. Я впевнений, що це на радіолокації. - Greg Lowe
@SantiagoCorredoira: У 2016 році це заслуговує бути прийнятою відповіддю. Будь ласка, розгляньте перепризначення BGT (велика зелена галочка). - Lawrence Dol
@Noitidart I Тестувала, і вона ідеально працює для Firefox 54, Chrome OS 60 та веб-переглядача, навіть якщо фокус не знаходиться в документі html, то помилка, яка ви маєте, ймовірно, специфічна для версії FF 55 - Tosin John
@Noitidart Він все ще ідеально працює тут, зосереджуючись на інструментах dev, не зупинивши його. І, до речі, що робить звичайний користувач веб-програми за допомогою інструментів розробника - Tosin John


Якщо ви хочете отримати дійсно просте рішення (це займає менше 5 хвилин для інтеграції) і добре виглядає прямо з коробки, Clippy - це чудова альтернатива деяким складнішим рішенням.

Кліппі

Він був написаний співзасновником Гітуба. Приклад вставлення флеш-карти внизу:

<object 
   classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
   width="110"
   height="14"
   id="clippy">
  <param name="movie" value="/flash/clippy.swf"/>
  <param name="allowScriptAccess" value="always"/>
  <param name="quality" value="high"/>
  <param name="scale" value="noscale"/>
  <param NAME="FlashVars" value="text=#{text}"/>
  <param name="bgcolor" value="#{bgcolor}"/>
  <embed 
     src="/flash/clippy.swf"
     width="110"
     height="14"
     name="clippy"
     quality="high"
     allowScriptAccess="always"
     type="application/x-shockwave-flash"
     pluginspage="http://www.macromedia.com/go/getflashplayer"
     FlashVars="text=#{text}"
     bgcolor="#{bgcolor}"/>
</object>

Не забудьте замінити #{text} з текстом, який вам потрібно скопіювати, і #{bgcolor} з кольором


93
2017-10-17 14:40



Для всіх, хто зацікавлений, перевірте Clippy, який використовується в GitHub при копіюванні URL-адреси для репо. - Radek
FYI, використання Clippy на GitHub замінено ZeroClipboard. - James M. Greene
ОП хотів знайти рішення в JavaScript. Не спалахує - MT.
@MT, за допомогою "javascript" деякі люди мають на увазі "у клієнті браузера", тому що, хоча JS-може бути вимогою, багато людей, які мають шанс на цю відповідь, дійсно шукають JS-або-інші-широко підтримуються- клієнт-технік. Flash не потрапляє на всі платформи, але для польської функції, як-от підтримка буфера обміну, варто додати, якщо це покращує UX над спливаючим діалоговим вікном (що це, безумовно, робить). - Dave Dopson
Зараз покладаючись на Flash, означає, що речі не працюють на відсоток відвідувачів сайту, що є неприйнятним для майже всіх, хто робить веб-розробку. - jinglesthula


Читання та зміна буфера обміну з веб-сторінки підвищує безпеку та конфіденційність. Проте в Internet Explorer це можливо зробити. Я знайшов це приклад фрагмента:

    <script type="text/javascript">
        function select_all(obj) {
            var text_val=eval(obj);
            text_val.focus();
            text_val.select();
            r = text_val.createTextRange();
            if (!r.execCommand) return; // feature detection
            r.execCommand('copy');
        }
    </script>
    <input value="http://www.sajithmr.com"
     onclick="select_all(this)" name="url" type="text" />


78
2017-12-30 13:33



Використання спалаху для простої операції копіювання, схоже, є надмірним, і радий, що для цього є чистий JS-спосіб. І оскільки ми знаходимося в корпоративному середовищі. IE просто чудово. Спасибі Бенді! - Eddie
PLZ пояснити що execCommand(\\’copy\\’); робить, якщо не скопіювати в буфер обміну для IE? @mrBorna - RozzA
добре працює в IE7-IE9, дякую! - luschn
Не використовувати if(!document.all) але if(!r.execCommand) щоб хто-небудь не реалізував це! Document.all абсолютно не відповідає цьому. - m93a
Людина, це те, що я люблю простий і чистий код, він працює майже назавжди з невеликим змістом. Це зробило це для мене. Це прекрасно працює. - Samuel Ramzan


Я нещодавно написав a технічний блог на цю саму проблему (я працюю в Lucidchart, і ми нещодавно провели капітальний ремонт в нашому буфер обміну).

Копіювання звичайного тексту в буфер обміну порівняно простий, якщо ви хочете зробити це під час виклику системи копіювання (користувач натискає CtrlС або використовує меню браузера).

var isIe = (navigator.userAgent.toLowerCase().indexOf("msie") != -1 
           || navigator.userAgent.toLowerCase().indexOf("trident") != -1);

document.addEventListener('copy', function(e) {
    var textToPutOnClipboard = "This is some text";
    if (isIe) {
        window.clipboardData.setData('Text', textToPutOnClipboard);    
    } else {
        e.clipboardData.setData('text/plain', textToPutOnClipboard);
    }
    e.preventDefault();
});

Введення тексту в буфер обміну не під час операції системного копіювання набагато складніше. Схоже, що деякі з цих інших відповідей наводяться способи зробити це через Flash, що є єдиним кросбраузерним способом це зробити (наскільки я розумію).

Окрім цього, в браузері на основі браузера існують деякі параметри.

Це найпростіший у IE, де ви можете будь-коли отримати доступ до об'єкта clipboardData з JavaScript за допомогою:

window.clipboardData

(Коли ви намагаєтесь зробити це за межами системи, вирізати, скопіювати чи вставити подію, проте IE запропонує користувачеві видавати дозвіл буфера обміну веб-додатком.)

У Chrome ви можете створити розширення Chrome, яке надасть вам дозволи на буфер обміну (це те, що ми робимо для Lucidchart). Тоді для користувачів із встановленим розширенням вам потрібно просто запустити системну подію самостійно:

document.execCommand('copy');

Схоже, Firefox має деякі варіанти які дозволяють користувачам надавати дозволи певним сайтам на доступ до буфера обміну, але я не пробував жодного з них особисто.


65
2017-12-03 20:31



Не згадано в публікації блогу (я сподіваюсь оновити його найближчим часом) - це можливість запускати вирізання та копіювання за допомогою execCommand. Це підтримується в IE10 +, Chrome 43+ та Opera29 +. Про це читайте тут. updates.html5rocks.com/2015/04/cut-and-copy-commands - Richard Shurtz
Проблема з цим полягає в тому, що вона виконує інші звичайні події для копіювання. - Brock Adams


clipboard.js це невелика, не flash-утиліта, яка дозволяє копіювати текстові чи HTML-дані в буфер обміну. Це дуже простий у використанні, просто додайте .js і використовуйте щось на зразок цього:

<button id='markup-copy'>Copy Button</button>

<script>
document.getElementById('markup-copy').addEventListener('click', function() {
  clipboard.copy({
    'text/plain': 'Markup text. Paste me into a rich text editor.',
    'text/html': '<i>here</i> is some <b>rich text</b>'
  }).then(
    function(){console.log('success'); },
    function(err){console.log('failure', err);
  });

});
</script>

clipboard.js також включений GitHub


44
2017-08-11 15:33



Ця бібліотека використовується angular.io для її Tour of Hero та резервного копіювання в граціозному режимі для браузера, який не підтримує execCommand, виводячи попередньо вибраний текст, який користувач має просто скопіювати. - John-Philip


ZeroClipboard - це найкраща взаємозалежна браузерна програма, яку я знайшов:

<div id="copy" data-clipboard-text="Copy Me!">Click to copy</div>    
<script src="ZeroClipboard.js"></script>
<script>
  var clip = new ZeroClipboard( document.getElementById('copy') );
</script>

Якщо вам потрібна підтримка не-спалаху для iOS, ви просто додаєте зворотний зв'язок:

clip.on( 'noflash', function ( client, args ) {
    $("#copy").click(function(){            
        var txt = $(this).attr('data-clipboard-text');
        prompt ("Copy link, then click OK.", txt);
    });
});  

http://zeroclipboard.org/

https://github.com/zeroclipboard/ZeroClipboard


35
2017-11-21 20:41



крос-браузер з Flash? не працює на iOS і Android 4.4 - Raptor
Див. Оновлений відповідь. Це дозволяє менше кроків для флеш-користувачів і відкат для всіх інших. - Justin
він має мільярд рядків коду. це абсолютно висміює. краще не робити це взагалі, ніж включити такого монстра в проект - vsync
Є проста версія gist.github.com/JamesMGreene/8698897 це 20K, що не містить усіх дзвінків у версії 74k. Не дуже великий. Я думаю, більшість користувачів в порядку з додатковими мілісекундами, що завантажений 74k або 20k файл буде потрібно, так що копіювання / вставка - це один клік замість двох. - Justin
@Justin я просто не можу зробити це працювати на місці, навіть якщо я копіюю та вставте приклади (я роблю мінімальні зміни, наприклад, значення src в тегах сценарію). Я відчуваю, що їх документація досить, але неефективна. - Gui Imamura


Ось моя брати на це один ..

function copy(text) {
    var input = document.createElement('input');
    input.setAttribute('value', text);
    document.body.appendChild(input);
    input.select();
    var result = document.execCommand('copy');
    document.body.removeChild(input)
    return result;
 }

30
2017-09-14 09:20



Працював на першій спробі. Підбадьорює - JustAGuy
Радий почути, що я допоміг. - nikksan
Працює як чарівність, спасибі за допомогу. +1 - FONGOH MARTIN
@ nikksan як скопіювати рядок з \n? - sof-03
Не працює в Microsoft Edge 42.17134.1.0 на Win10x64 - Honsa Stunna