This code works fine in Google Chrome, Opera, IE 11. But it doesn't work in Mozilla firefox and Safari. I get error in the following string "var successful = document.execCommand('copy');"
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Test Copy</title>
<link href="css/bootstrap-theme.css" rel="stylesheet">
<link href="css/bootstrap.css" rel="stylesheet">
<script src="js/bootstrap.js"></script>
<script src="js/npm.js"></script>
<script src=".min.js"></script>
</head>
<body>
<div id="text">
Copytextblalalalal
</div>
<button id="btnCopy" onclick="copyText()">COPY</button>
</div>
</div>
<script>
function copyText() {
var emailLink = document.querySelector('#text');
var range = document.createRange();
range.selectNode(emailLink);
window.getSelection().addRange(range);
try {
var successful = document.execCommand('copy');
var msg = successful ? 'successful' : 'unsuccessful';
console.log('Copy mand was ' + msg);
} catch (err) {
console.log('Oops, unable to copy');
}
window.getSelection().removeAllRanges();
}
</script>
</body>
</html>
This code works fine in Google Chrome, Opera, IE 11. But it doesn't work in Mozilla firefox and Safari. I get error in the following string "var successful = document.execCommand('copy');"
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Test Copy</title>
<link href="css/bootstrap-theme.css" rel="stylesheet">
<link href="css/bootstrap.css" rel="stylesheet">
<script src="js/bootstrap.js"></script>
<script src="js/npm.js"></script>
<script src="http://ajax.googleapis./ajax/libs/jquery/1/jquery.min.js"></script>
</head>
<body>
<div id="text">
Copytextblalalalal
</div>
<button id="btnCopy" onclick="copyText()">COPY</button>
</div>
</div>
<script>
function copyText() {
var emailLink = document.querySelector('#text');
var range = document.createRange();
range.selectNode(emailLink);
window.getSelection().addRange(range);
try {
var successful = document.execCommand('copy');
var msg = successful ? 'successful' : 'unsuccessful';
console.log('Copy mand was ' + msg);
} catch (err) {
console.log('Oops, unable to copy');
}
window.getSelection().removeAllRanges();
}
</script>
</body>
</html>
Share
Improve this question
edited May 6, 2015 at 14:04
Vadim Denisuk
asked May 6, 2015 at 13:50
Vadim DenisukVadim Denisuk
4463 silver badges19 bronze badges
5
- From mdn : "copy Copies the current selection to the clipboard. For Mozilla, clipboard capability must be enabled in the user.js preference file. See A brief guide to Mozilla preferences for more information." – Kaiido Commented May 6, 2015 at 14:08
- @Kaiido this solution doesn't work. Firefox version 37.0.2 – Vadim Denisuk Commented May 6, 2015 at 14:32
- did you follow those steps ? (didn't tried myself) – Kaiido Commented May 6, 2015 at 14:47
- Also always though that this answer was the best solution : stackoverflow./a/6055620/3702797 I would hate your website so much if because of some action I wasn't aware, I do loose all the content I kept in my Clipboard – Kaiido Commented May 6, 2015 at 15:00
- 1 @Kaiido According to bugzilla.mozilla/show_bug.cgi?id=913734 , capability.policy.* preferences have been removed since firefox 29. The documentation is not up to date. – 林果皞 Commented May 8, 2015 at 8:43
1 Answer
Reset to default 5As of Firefox 41 (September 2015) the copy mand should be available by default when triggered from certain trusted (user-triggered) events, such as what would be fired in response to a button click. The patibility table from MDN offers further information, see also the release notes.
The code in the question should therefore work. Indeed, I tested something very similar (see code below) and it worked great for me using Firefox 44.
function doCopy() {
var textToCopy = document.getElementById('textToCopy');
var range = document.createRange();
range.selectNodeContents(textToCopy);
window.getSelection().addRange(range);
document.execCommand('copy');
}
(function() {
var el = document.getElementById("copyTrigger");
el.addEventListener("click", doCopy, false);
})();
textarea {display: block; margin-top: 1em; width: 500px;}
<div id="textToCopy">Elephant</div>
<button id="copyTrigger">Copy above text</button>
<textarea placeholder="Try pasting here to test"></textarea>
发布者:admin,转转请注明出处:http://www.yc00.com/questions/1745431607a4627416.html
评论列表(0条)