用于短暂闪烁消息的书签

Question

正在尝试开发一个小书签来复制网页上特定字段的内容，然后短暂地闪烁一条确认消息。已经让这两个部分分开工作。无法弄清楚如何将它们组合起来，然后将该代码放入 Bookmarklet 的 URL 字段中。

javascript: (function(){var copyText = document.getElementById("mergeFields-input-text");copyText.select();document.execCommand("Copy"); 
function tempAlert(msg,duration)
{
     var el = document.createElement("div");
     el.setAttribute("style","position:absolute;top:5%;left:20%;background-color:white;");
     el.innerHTML = msg;
     setTimeout(function(){
      el.parentNode.removeChild(el);
     },duration);
     document.body.appendChild(el);
}

var d = document.getElementById('mergeFields-input-text');
d.onclick = function(){ tempAlert("Copied",5000); })();

Answer 1

无需添加 'onclick' 事件。试试这个书签：

javascript:(function() {
    var copyText = document.getElementById("mergeFields-input-text");
    copyText.select();
    document.execCommand("Copy");

    tempAlert("Copied", 5000);
    function tempAlert(msg, duration) {
        var el = document.createElement("div");
        el.setAttribute("style","position:absolute;top:5%;left:20%;background-color:white;");
        el.innerHTML = msg;
        document.body.appendChild(el);

        setTimeout(function(){
                el.parentNode.removeChild(el);
            }, duration
        );
    }
})();

Answer 2

上面来自 Shugar 的代码回答了我关于复制的问题，下面这段代码也是来自他，除了粘贴之外做同样的事情：

javascript:(function() {
    var pasteText = document.getElementById("mergeFields-input-text").select();
    document.execCommand("Paste");
 
 
    tempAlert("PASTED SUBJECT", 500);
    function tempAlert(msg, duration) {
        var el = document.createElement("div");
        el.setAttribute("style","position:absolute;top:2%;left:45%;background-color:yellow;");
        el.innerHTML = msg;
        document.body.appendChild(el);
 
        setTimeout(function(){
                el.parentNode.removeChild(el);
            }, duration
        );
    }
})();

用于短暂闪烁消息的书签

Bookmarklet to briefly flash a message

html

javascript

browser

dom

bookmarklet