我可以将书签放入剪贴板吗?

时间:2011-07-26 16:46:59

标签: copy-paste bookmarklet

说我想要一些文本(实际上是4个不同的地址),我希望能够轻松(并经常)粘贴。有没有办法制作一个将这些地址放入剪贴板的书签? 我希望能够单击相应的,然后右键单击+粘贴。

3 个答案:

答案 0 :(得分:2)

是的,可以看看zeroclipboard(注意:需要闪光灯)。另请参阅this previous question

答案 1 :(得分:1)

尝试构建Firefox扩展而不是bookmarklet。 Mozilla XUL(扩展语言)允许您进行复制粘贴。另一个选项是Java Applet。

http://brooknovak.wordpress.com/2009/07/28/accessing-the-system-clipboard-with-javascript/

答案 2 :(得分:0)

没有第三方库的方法

虽然 zeroclipboard 可能有效,但此方法将允许您直观地选择一个元素并自动将内部文本复制到剪贴板,而无需下载任何第三方库。它基于 this function by Arne Hartherz 并经过修改以在 HTTPS 和 HTTP 上下文中工作。

可读版本:

var overlay = document.createElement('div');
Object.assign(overlay.style, {
    position: 'fixed',
    top: 0,
    left: 0,
    width: '100vw',
    height: '100vh',
    zIndex: 99999999,
    background: 'transparent',
    cursor: 'crosshair'
});
document.body.append(overlay);

function copyToClipboard(textToCopy) {
    // navigator clipboard api needs a secure context (https)
    if (navigator.clipboard && window.isSecureContext) {
        // navigator clipboard api method'
        return navigator.clipboard.writeText(textToCopy);
    } else {
        // text area method
        let textArea = document.createElement("textarea");
        textArea.value = textToCopy;
        // make the textarea out of viewport
        textArea.style.position = "fixed";
        textArea.style.left = "-999999px";
        textArea.style.top = "-999999px";
        document.body.appendChild(textArea);
        textArea.focus();
        textArea.select();
        return new Promise((res, rej) => {
            // here the magic happens
            document.execCommand('copy') ? res() : rej();
            textArea.remove();
        });
    }
};

function getElement(event) {
    overlay.style.pointerEvents = 'none';
    var element = document.elementFromPoint(event.clientX, event.clientY);
    overlay.style.pointerEvents = 'auto';

    return element;
}

document.addEventListener('mousemove', function(event) {
    var element = getElement(event);
    if (!element) return;

    var position = element.getBoundingClientRect();

    Object.assign(overlay.style, {
        background: 'rgba(0, 128, 255, 0.25)',
        outline: '1px solid rgba(0, 128, 255, 0.5)',
        top: '' + position.top + 'px',
        left: '' + position.left + 'px',
        width: '' + position.width + 'px',
        height: '' + position.height + 'px'
    });
});

overlay.addEventListener('click', function(event) {
    var element = getElement(event);
    var text = element.textContent || element.value;
    text = text.replace(/\n[ \n]+\n/g, "\n").replace(/\n\n+/g, "\n\n").replace(/^\n+|\n+$/g, '');
    if (!text.match("\n")) text = text.replace(/^ +| +$/, '')

    copyToClipboard(text);
    document.body.removeChild(overlay);
});

用于书签的缩小版:

javascript:void function(){function a(a){if(navigator.clipboard&&window.isSecureContext)return navigator.clipboard.writeText(a);else{let b=document.createElement("textarea");return b.value=a,b.style.position="fixed",b.style.left="-999999px",b.style.top="-999999px",document.body.appendChild(b),b.focus(),b.select(),new Promise((a,c)=>{document.execCommand("copy")?a():c(),b.remove()})}}function b(a){c.style.pointerEvents="none";var b=document.elementFromPoint(a.clientX,a.clientY);return c.style.pointerEvents="auto",b}var c=document.createElement("div");Object.assign(c.style,{position:"fixed",top:0,left:0,width:"100vw",height:"100vh",zIndex:99999999,background:"transparent",cursor:"crosshair"}),document.body.append(c);document.addEventListener("mousemove",function(a){var d=b(a);if(d){var e=d.getBoundingClientRect();Object.assign(c.style,{background:"rgba(0, 128, 255, 0.25)",outline:"1px solid rgba(0, 128, 255, 0.5)",top:""+e.top+"px",left:""+e.left+"px",width:""+e.width+"px",height:""+e.height+"px"})}}),c.addEventListener("click",function(d){var e=b(d),f=e.textContent||e.value;f=f.replace(/\n[ \n]+\n/g,"\n").replace(/\n\n+/g,"\n\n").replace(/^\n+|\n+$/g,""),f.match("\n")||(f=f.replace(/^ +| +$/,"")),a(f),document.body.removeChild(c)})}();