在 Javascript 中添加复制按钮
Add copy button in Javascript
我正在尝试添加一个按钮,该按钮将使用 ZeroClipboard 从文本区域复制文本,但是,当我单击该按钮时,没有任何反应,当我粘贴时,没有任何内容被添加到剪贴板。
var clip = new ZeroClipboard( document.getElementById("btn4"), {
moviePath: "https://rawgit.com/zeroclipboard/zeroclipboard/master/dist/ZeroClipboard.swf"
} );
clip.on( "load", function(client) {
// alert( "movie is loaded" );
client.on( "complete", function(client, args) {
// `this` is the element that was clicked
this.style.display = "none";
} );
} );
<div id ="right" style = "float:left; width: 10%; margin-left:185px; margin-top:35px">
<button id="btn4" data-clipboard-target="block2" name ="btn4" type="button" class="btn btn-success"><i class="icon-white icon-file"></i> Copy</button>
<script src="https://rawgit.com/zeroclipboard/zeroclipboard/master/dist/ZeroClipboard.js"></script>
</div>
<textarea id="block2" name="block2" style="font-family:rockwell; background-color:#D1D1D1"></textarea>
尝试:
<script language="JavaScript">
var copyTextareaBtn = document.querySelector('.btn4');
copyTextareaBtn.addEventListener('click', function(event) {
var copyTextarea = document.querySelector('.block2');
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');
}
});
</script>
我正在尝试添加一个按钮,该按钮将使用 ZeroClipboard 从文本区域复制文本,但是,当我单击该按钮时,没有任何反应,当我粘贴时,没有任何内容被添加到剪贴板。
var clip = new ZeroClipboard( document.getElementById("btn4"), {
moviePath: "https://rawgit.com/zeroclipboard/zeroclipboard/master/dist/ZeroClipboard.swf"
} );
clip.on( "load", function(client) {
// alert( "movie is loaded" );
client.on( "complete", function(client, args) {
// `this` is the element that was clicked
this.style.display = "none";
} );
} );
<div id ="right" style = "float:left; width: 10%; margin-left:185px; margin-top:35px">
<button id="btn4" data-clipboard-target="block2" name ="btn4" type="button" class="btn btn-success"><i class="icon-white icon-file"></i> Copy</button>
<script src="https://rawgit.com/zeroclipboard/zeroclipboard/master/dist/ZeroClipboard.js"></script>
</div>
<textarea id="block2" name="block2" style="font-family:rockwell; background-color:#D1D1D1"></textarea>
尝试:
<script language="JavaScript">
var copyTextareaBtn = document.querySelector('.btn4');
copyTextareaBtn.addEventListener('click', function(event) {
var copyTextarea = document.querySelector('.block2');
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');
}
});
</script>