clipboard.js ist ein Plug-in, das Text ohne Flash in die Zwischenablage kopiert. Dieser Artikel führt Sie hauptsächlich in die grundlegende Verwendung von clipboard.js ein. Ich hoffe, er kann Ihnen helfen.
<script src="js/clipboard.min.js"></script>
Zuerst müssen Sie es instanziieren, indem Sie einen DOM-Selektor, ein HTML-Element oder eine Liste von HTML-Elementen übergeben.
new Clipboard('.btn');
1 Verwenden Sie ein Element als Auslöser, um den Text eines anderen Elements zu kopieren. Dem Attribut data-clipboard-target muss der Attributselektor
<!-- Target --> <input id="foo" value="https://github.com/zenorocha/clipboard.js.git"> <!-- Trigger --> <button class="btn" data-clipboard-target="#foo"> </button>
<!-- Target -->
<textarea id="bar">Mussum ipsum cacilds...</textarea>
<!-- Trigger -->
<button class="btn" data-clipboard-action="cut" data-clipboard-target="#bar">
Cut to clipboard
</button><button class="btn" data-clipboard-text="Just because you can doesn't mean you should — clipboard.js">
Copy to clipboard
</button>2 Zeigen Sie Benutzerfeedback an oder erfassen Sie die Auswahl nach dem Kopier-/Ausschneidevorgang. Operation, Text, Triggerelement
var clipboard = new Clipboard('.btn');
clipboard.on('success', function(e) {
console.info('Action:', e.action);
console.info('Text:', e.text);
console.info('Trigger:', e.trigger);
e.clearSelection();
});
clipboard.on('error', function(e) {
console.error('Action:', e.action);
console.error('Trigger:', e.trigger);
});<body>
<input id="foo" value="https://github.com/zenorocha/clipboard.js.git">
<!-- Trigger -->
<button id='foo_1' class="btn" data-clipboard-target="#foo">
</button>
</body>
<script>
new Clipboard('.btn', {
text: function(trigger) {
if(trigger.getAttribute('id')=='foo_1'){
return 1;
}else{
return 2;
}
}
});
</script>clipboard.js verwendet HTML-Seiten, um Informationen in die Zwischenablage zu kopieren
ZeroClipboard.js verwendet einen Flash, um mehrere Textfelder zu kopieren
Clipboard.js JavaScript-Bibliothek zum Kopieren und Einfügen ohne Flash_Javascript-Tipps
Das obige ist der detaillierte Inhalt vonTeilen der grundlegenden Verwendung von clipboard.js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
