禁用选择,允许复制/粘贴

时间:2017-02-24 11:24:53

标签: javascript html css html5 google-chrome

我正在构建一个覆盖标准选择行为并允许复制和粘贴元素的应用程序。问题是如果我禁用选择,复制事件也会消失。

我尝试使用

onselectstart="return false;"

.no-select {     
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;  
}

并且它可以工作,但它也会禁用复制事件。

我还尝试仅为包含文本的这些部分添加.no-select属性,但它很难维护并且无法正常工作 - 有时复制事件被阻止,我无法控制它。

如何禁用选择,但是能否正确启用复制/粘贴?

修改

  • 我不想复制文本,而是我自己的json结构。复制在onCopy处理程序中处理。
  • 我需要订阅由chrome菜单或系统短片启动的标准chrome复制事件。

1 个答案:

答案 0 :(得分:1)

当您禁用突出显示/选择时,您想复制什么?未选择的东西仍然没有什么

  

我不想复制文字(这是标准行为),但我自己   json表示对象

然后我有两个问题的解决方案:

  1. 覆盖上下文菜单,功能复制到剪贴板(tutoriallibrary

    
    
    if (document.addEventListener) {
            document.addEventListener('contextmenu', function(e) {
                alert("Write own menu with copy");
                e.preventDefault();
            }, false);
        } else {
            document.attachEvent('oncontextmenu', function() {
                alert("Write own menu with copy");
                window.event.returnValue = false;
            });
        }
    
    body {     
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;  
    }
    
    <body>
    Some text
    </body>
    &#13;
    &#13;
    &#13;

  2. 添加&#34;复制&#34;功能复制到剪贴板的按钮(tutoriallibrary

  3. 将键组合ctrl + c(以及其他类似command + c)与功能复制绑定到剪贴板(tutoriallibrary
  4. 使用Flash或其他外部浏览器插件提供复制到剪贴板功能(not recommended