进一步提出这个问题:
Copy to clipboard with jQuery/js in Chrome
上述问题的代码非常适合用javascript将字符串复制到剪贴板,但是我需要从用户点击注入元素来触发该过程。出于某种原因,如果注入元素,代码将无法工作。有人可以让我直截了当吗?
在下面的代码示例中,我添加了一个红色?按钮并将其添加到身体上。请注意,单击它不会将所需的文本复制到剪贴板。倒q'hy?有什么想法吗?
(请注意,我在jQuery中添加了我的位作为个人偏好)
var elem = document.getElementById('test');
var elem2 = document.getElementById('test2');
var elem3 = document.getElementById('test3');
elem.onmouseup = function () {
document.execCommand('copy');
}
elem2.addEventListener('copy', function (e) {
e.preventDefault();
if (e.clipboardData) {
e.clipboardData.setData('text/plain', 'custom content');
} else if (window.clipboardData) {
window.clipboardData.setData('Text', 'custom content');
}
});
elem3.onclick = function () {
document.execCommand('copy');
}
elem3.addEventListener('copy', function (e) {
e.preventDefault();
if (e.clipboardData) {
e.clipboardData.setData('text/plain', 'bonk custom contentt');
} else if (window.clipboardData) {
window.clipboardData.setData('Text', 'bonkcustom content from click');
}
});
$('body').prepend('<div id="test4" title="Click to copy text RAINBOX to clipboard">?</div>');
$(document).on('click', '#test4', function(e){
document.execCommand('copy');
});
$(document).on('copy', '#test4', function(e){
e.preventDefault();
if (e.clipboardData) {
e.clipboardData.setData('text/plain', 'Over the rainbox');
} else if (window.clipboardData) {
window.clipboardData.setData('Text', 'Rainbox');
}
});
#test4{display:inline-block;background-color:tomato;font-size:1.2rem;padding:0 5px;border-radius:3px;cursor:pointer;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<div id='test'>Select text, it'll copy on mouse up</div>
<div id='test2'>Copy text using ctrl-c</div>
<div id='test3'>Click here to copy text</div>
<div id='ta'><textarea cols="40" rows="5" placeholder="Test pasting here"></textarea></div>
答案 0 :(得分:3)
使用 win = new BrowserWindow({width: 800, height: 600})
const template = [
{
label: 'Custom',
submenu: [
{
label: 'navigate',
click ()
{
win.loadURL('https://electron.atom.io');
}
}
]
}
]
const menu = Menu.buildFromTemplate(template)
Menu.setApplicationMenu(menu)
// and load the index.html of the app.
win.loadURL(url.format({
pathname: path.join(__dirname, 'index.html'),
protocol: 'file:',
slashes: true
}))
获取原始事件,而不是jQuery事件对象
e.originalEvent.clipboardData
&#13;
var elem = document.getElementById('test');
var elem2 = document.getElementById('test2');
var elem3 = document.getElementById('test3');
elem.onmouseup = function () {
document.execCommand('copy');
}
elem2.addEventListener('copy', function (e) {
e.preventDefault();
if (e.clipboardData) {
e.clipboardData.setData('text/plain', 'custom content');
} else if (window.clipboardData) {
window.clipboardData.setData('Text', 'custom content');
}
});
elem3.onclick = function () {
document.execCommand('copy');
}
elem3.addEventListener('copy', function (e) {
e.preventDefault();
if (e.clipboardData) {
e.clipboardData.setData('text/plain', 'bonk custom contentt');
} else if (window.clipboardData) {
window.clipboardData.setData('Text', 'bonkcustom content from click');
}
});
$('body').prepend('<div id="test4" title="Click to copy text RAINBOX to clipboard">?</div>');
$(document).on('click', '#test4', function(e){
document.execCommand('copy');
});
$(document).on('copy', '#test4', function(e){
e.preventDefault();
if (e.originalEvent.clipboardData) {
e.originalEvent.clipboardData.setData('text/plain', 'Over the rainbox');
} else if (window.clipboardData) {
window.clipboardData.setData('Text', 'Rainbox');
}
});
&#13;
#test4{display:inline-block;background-color:tomato;font-size:1.2rem;padding:0 5px;border-radius:3px;cursor:pointer;}
&#13;
答案 1 :(得分:0)
您需要将on
事件发送到动态创建的元素。试试这个:
$('#test4').on("click", function() {
//Your copy code here
});