Copy image to clipboard

by

This worked across all browsers (as of 2016). I have uploaded on GitHub as well: https://github.com/owaisafaq/copier-js

//Cross-browser function to select content
function SelectText(element) {
  var doc = document;
  if (doc.body.createTextRange) {
    var range = document.body.createTextRange();
    range.moveToElementText(element);
    range.select();
  } else if (window.getSelection) {
    var selection = window.getSelection();
    var range = document.createRange();
    range.selectNodeContents(element);
    selection.removeAllRanges();
    selection.addRange(range);
  }
}
$(".copyable").click(function(e) {
  //Make the container Div contenteditable
  $(this).attr("contenteditable", true);
  //Select the image
  SelectText($(this).get(0));
  //Execute copy Command
  //Note: This will ONLY work directly inside a click listenner
  document.execCommand('copy');
  //Unselect the content
  window.getSelection().removeAllRanges();
  //Make the container Div uneditable again
  $(this).removeAttr("contenteditable");
  //Success!!
  alert("image copied!");
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="copyable">
  <img src="https://via.placeholder.com/80" alt="Copy Image to Clipboard via Javascript." />
</div>

<div class="copyable">
  <img src="https://via.placeholder.com/80" alt="Copy Image to Clipboard via Javascript." />
</div>

More Related Contents:

  1. How to copy text to the client’s clipboard using jQuery? [duplicate]
  2. Using execCommand (Javascript) to copy hidden text to clipboard
  3. Copy to clipboard without Flash
  4. Copy selected text to the clipboard WITHOUT using flash – must be cross-browser
  5. Copy to clipboard with break line
  6. Copy and paste clipboard in JavaScript. or jQuery
  7. Uncaught ReferenceError: $ is not defined?
  8. How to manage a redirect request after a jQuery Ajax call
  9. Is there a case insensitive jQuery :contains selector?
  10. Regex to replace multiple spaces with a single space
  11. How to detect Ctrl+V, Ctrl+C using JavaScript?
  12. Trying to fire the onload event on script tag
  13. Check if element exists in jQuery [duplicate]
  14. Jquery load() only working in firefox?
  15. How to run two jQuery animations simultaneously?
  16. Setting query string using Fetch GET request
  17. Uncaught SyntaxError: Unexpected token with JSON.parse
  18. Hide select option in IE using jQuery
  19. Play an audio file using jQuery when a button is clicked
  20. Selecting Part of String inside an Input Box with jQuery
  21. jQuery.proxy() usage
  22. How to build simple tabs with jQuery?
  23. JavaScript: Invoking click-event of an anchor tag from javascript
  24. Why my $.ajax showing “preflight is invalid redirect error”?
  25. How can I get all a form’s values that would be submitted without submitting [duplicate]
  26. Changing “src” attribute of
  27. Is there a better jQuery solution to this.form.submit();?
  28. $.post throwing “Illegal invocation “
  29. Google’s Places API and JQuery request – Origin http://localhost is not allowed by Access-Control-Allow-Origin
  30. Create a table in SVG

Leave a Comment