如何在优胜美地OS X的Safari 8中复制到剪贴板？

问题描述

我正在运行confluence，并在Yosemite操作系统上使用Safari 8访问它。 Confluence具有一个很好的功能，称为“ Share a page”，该功能会生成一个TinyURL，并允许用户单击下面显示的“复制”按钮，将微小的URL复制到剪贴板。

单击“复制”，然后尝试粘贴（使用CRTL-V）在Safari v8中不起作用，但是在优胜美地的Firefox Quantum v60中起作用。但是，在Safari v8和Firefox 60上都可以先执行CRTL-C再执行CRTL-V。

如何在Safari v8上使用“复制”按钮？

我更深入地挖掘了一下，发现下面的javascript文件执行了“复制到剪贴板”功能。请在“在Firefox 60中使用而不是在Safari 8中使用”下面的末尾寻找我的评论。该行应该将Tiny URL复制到剪贴板。它可以在Firefox中成功运行，但不能在Safari中成功运行。如何更改代码以使其在Safari 8中正常工作？

define('confluence/share-page/popup/setup-share-link',[
    'jquery','confluence/share-page/service/analytics-service','confluence/share-page/util/show-message'
],function ($,analyticsService,showMessage) {

    /**
     * Resolves the link. If it's a function,it will evaluate it,otherwise
     * it will just return it if it's a string,or return window.location if it's not
     * either of those things.
     * @param {function|string} link
     * @private
     */
    function _resolveLink(link) {
        if (typeof link === 'function') {
            return $.when(link());
        }
        if (typeof link === 'string') {
            return $.when(link);
        }
        return $.when(window.location);
    }

    /**
     * Adds analytics parameters to link. Returns the new link with query
     * parameters concatenated.
     * @param {string} link
     * @private
     */
    function _addAnalyticsToLink(link) {
        if (("" + link).indexOf('resumedraft.action') === -1) {
            return link;
        }

        var analyticsQueryParamString = 'src=shareui' +
            '&src.shareui.timestamp=' + (new Date()).getTime();

        var firstChar;
        if (window.location.search.length === 0) {
            firstChar = '?';
        } else {
            firstChar = '&';
        }

        return link + firstChar + analyticsQueryParamString;
    }

    /**
     * Sets up the Share Link and button to copy the link to clipboard
     * @param $container
     * @param parameters        The dialog's parameters passed-through
     */
    return function setupShareLink($container,parameters) {
        var $row = $container.find('.share-copy-link');
        var $shareLink = $row.find('input');
        var $copyButton = $row.find('button');
        // Don't set it up if it doesn't exist
        if (!$shareLink.length) {
            return;
        }

        // Set the default link,then get the real link and update it;
        $shareLink.val(window.location);
        _resolveLink(parameters.link).then(function (link) {
            link = _addAnalyticsToLink(link);
            $shareLink.val(link);
        });

        $shareLink.on('click focus',/**
             * Select all the contents of the input field on click
             */
            function (e) {
                setTimeout(function () {
                    _selectLink();
                },0);
                e.preventDefault();
            });

        $shareLink.focus(function () {
            analyticsService.publish(analyticsService.SHARE_LINK_CLICKED,parameters.entityId,parameters.shareType);
        });
        $copyButton.click(function () {
            analyticsService.publish(analyticsService.SHARE_LINK_copY_CLICKED,parameters.shareType);
            _copy();
        });
        $shareLink.dblclick(function () {
            analyticsService.publish(analyticsService.SHARE_LINK_DOUBLE_CLICKED,parameters.shareType);
            _copy();
        });

        $shareLink.blur(function () {
            $shareLink.removeData('selected');
        });

        $(document).off('copy.share-link').on('copy.share-link',function () {
            if (!$shareLink.data('selected')) {
                return;
            }
            analyticsService.publish(analyticsService.SHARE_LINK_copIED,parameters.shareType);
            showMessage($row,'copied',parameters,false,function () {
                $copyButton.prop('disabled',true);
            },false);
            });
        });


        /**
         * Select all the contents of the input field when the mouse
         * is there
         */
        function _selectLink() {
            $shareLink.select();
            $shareLink.data('selected',true);
        }

        /**
         * copies the link to the clipboard
         */
        function _copy() {
            _selectLink();
            document.execCommand('copy'); // *** works in Firefox 60,not Safari 8
        }
    }
});

解决方法

在原始JavaScript中为copyText。

var doc,nav,I,copyText; // for use on other loads
addEventListener('load',function(){
doc = document; nav = navigator;
I = function(id){
  return doc.getElementById(id);
}
if(nav.clipboard){
  copyText = function(fromNode){
    fromNode.select(); nav.clipboard.writeText(fromNode.value.trim());
  }
}
else{
  copyText = function(fromNode){
    fromNode.select(); doc.execCommand('copy');
  }
}
// magic under here - except end load
var test = I('test'),test_button = I('test_button');
test_button.onclick = function(){
  copyText(test);
}
}); // end load

<input id='test' type='text' value='' /><input id='test_button' type='button' value='copy' />