Copy to clipboard

Copy to clipboard

Modern copy to clipboard features. Just 2kb without flash!

Copy text from another element

A pretty common use case is to copy content from another element. You can do that by adding a data-clipboard-targetattribute in your trigger element.

The value you include on this attribute needs to match another's element selector.

Please press the button and copy me!

HTML markup
<p id="copytext">Please press the button and copy me!</p><button class="btn btn-white" data-clipboard-target="#copytext"><i class="fa fa-copy"></i> Copy</button>

Cut text from another element

Additionally, you can define a data-clipboard-actionattribute to specify if you want to either copyor cutcontent.

HTML markup
<textarea id="cuttext">This is example text that will be cuted fromt this textarea control.</textarea><button class="btn btn-white" data-clipboard-action="cut" data-clipboard-target="#cuttext"><i class="fa fa-cut"></i> Cut to clipboard</button>
Playground
Paste and test you copied text.