我正在尝试复制剪贴板 onclick 事件上的数据，但无法对多个输入 id 执行此操作。这是我的代码和引用 stackoverflow url: Using execCommand (Javascript) to copy hidden text to clipboard
我的请求代码是:
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="copy-me" value="mohit text" type="text" class="copy">
<button id="copy-btn" onclick="idname(this.id, 'copy-me')">Copy</button><br><br>
<input id="copy-me1" value="mohit text2" type="text" class="copy">
<button id="copy-btn1" onclick="idname(this.id, 'copy-me')">Copy</button><br><br>
<input id="copy-me2" value="mohit text3" type="text" class="copy">
<button id="copy-btn2" onclick="idname(this.id, 'copy-me')">Copy</button><br><br>
<textarea placeholder="paste here"></textarea>
<script type="text/javascript">
function idname(a, b)
{
alert(a);
var copyBtn = $(a),
input = $(b);
copyBtn.on('click', copyToClipboard);
function copyToClipboardFF(text) {
window.prompt("Copy to clipboard: Ctrl C, Enter", text);
}
function copyToClipboard() {
var success = true,
range = document.createRange(),
selection;
// For IE.
if (window.clipboardData) {
window.clipboardData.setData("Text", input.val());
} else {
// Create a temporary element off screen.
var tmpElem = $('<div>');
tmpElem.css({
position: "absolute",
left: "-1000px",
top: "-1000px",
});
// Add the input value to the temp element.
tmpElem.text(input.val());
$("body").append(tmpElem);
// Select temp element.
range.selectNodeContents(tmpElem.get(0));
selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
// Lets copy.
try {
success = document.execCommand("copy", false, null);
}
catch (e) {
copyToClipboardFF(input.val());
}
if (success) {
alert("The text is on the clipboard, try to paste it!");
// remove temp element.
tmpElem.remove();
}
}
}
}
</script>
最佳答案
尝试这样(不需要额外的包装函数 idname):
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="copy-me" value="mohit text" type="text" class="copy">
<button id="copy-btn" onclick="copyToClipboard('#copy-me')">Copy</button><br><br>
<input id="copy-me1" value="mohit text2" type="text" class="copy">
<button id="copy-btn1" onclick="copyToClipboard('#copy-me1')">Copy</button><br><br>
<input id="copy-me2" value="mohit text3" type="text" class="copy">
<button id="copy-btn2" onclick="copyToClipboard('#copy-me2')">Copy</button><br><br>
<textarea placeholder="paste here"></textarea>
<script type="text/javascript">
function copyToClipboardFF(text) {
window.prompt("Copy to clipboard: Ctrl C, Enter", text);
}
function copyToClipboard(inputId) {
var input = $(inputId);
var success = true,
range = document.createRange(),
selection;
// For IE.
if (window.clipboardData) {
window.clipboardData.setData("Text", input.val());
} else {
// Create a temporary element off screen.
var tmpElem = $('<div>');
tmpElem.css({
position: "absolute",
left: "-1000px",
top: "-1000px",
});
// Add the input value to the temp element.
tmpElem.text(input.val());
$("body").append(tmpElem);
// Select temp element.
range.selectNodeContents(tmpElem.get(0));
selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
// Lets copy.
try {
success = document.execCommand("copy", false, null);
}
catch (e) {
copyToClipboardFF(input.val());
}
if (success) {
alert("The text is on the clipboard, try to paste it!");
// remove temp element.
tmpElem.remove();
}
}
}
</script>
关于javascript - 如何使用 jquery 将多个按钮 id 复制到剪贴板，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/36419704/