2015-06-15 355 views
0

我想将一些文本复制到网页中的剪贴板。我设置了一个文本框,其显示设置为“无”,并填充一些文本。然后当我点击按钮时,我尝试将剪贴板设置为其内容,但我一直收到空。我尝试了两种设置剪贴板的方法:设置隐藏字段“hfCTC”的值并调用ShowCTC2()并设置输入“ToCopy”的值并调用ShowCTC(),并且警报在两种情况下都显示为空。Javascript复制到剪贴板

我不希望按钮做回发,所以我在js函数中返回false。

<input type="text" id="ToCopy" style="display:none" /> 
<asp:HiddenField runat="server" ID="hfCTC" /> 
<input type="image" id="ibCTC" src="images/CTC.png" onclick="return ShowCTC();" /> 

function ShowCTC2(){ 
    if (document.all) // IE only 
    { 
     if (window.clipboardData && clipboardData.setData) 
     { 
      var ctrl = document.getElementById('<%=hfCTC.ClientID %>'); 
      var textToCopy = ctrl.value; 
      window.clipboardData.setData('Text', ctrl.text); 
      alert (window.clipboardData.getData ('Text')); 
     } 
    } 
    return false; 
} 

function ShowCTC(){ 
    if (document.all) // IE only 
    { 
     window.clipboardData.clearData ("Text"); 
     select_all(); 
     alert (window.clipboardData.getData ('Text')); 
    } 
    return false; 
} 
function select_all() { 
    var text_val = document.getElementById('ToCopy'); 
    text_val.focus(); 
    text_val.select(); 
    if (!document.all) return; // IE only 
    r = text_val.createTextRange(); 
    r.execCommand('copy'); 
} 

如果我注释掉剪贴板线的ShowCTC()清算和做手工CTL-C复制的东西,警报显示了我复制的,但剪贴板数据通过代码的设置似乎失败。

+0

无[这些](http://stackoverflow.com/search?q= [JavaScript的] +复制到剪贴板+)? – Teemu

+0

可能的重复[如何在JavaScript中复制到剪贴板?](http://stackoverflow.com/questions/400212/how-do-i-copy-to-the-clipboard-in-javascript) –

+0

简短回答,你不能出于安全原因。 –

回答

0

这篇文章解决了问题:

MSIE and addEventListener Problem in Javascript?

我改变了代码到以下内容:

<input type="image" id="ibCTC" src="images/ibCTC.png" class="js-textareacopybtn" /> 
<textarea class="js-copytextarea">Hello I'm some text</textarea> 

function bindEvent(el, eventName, eventHandler) { 
    if (el.addEventListener){ 
    el.addEventListener(eventName, eventHandler, false); 
    } else if (el.attachEvent){ 
    el.attachEvent('on'+eventName, eventHandler); 
    } 
} 

var copyTextareaBtn = document.querySelector('.js-textareacopybtn'); 
bindEvent(copyTextareaBtn, 'click',function(event) { 
     var copyTextarea = document.querySelector('.js-copytextarea'); 
     copyTextarea.select(); 
     try { 
     var successful = document.execCommand('copy'); 
     var msg = successful ? 'successful' : 'unsuccessful'; 
     alert('Copying text command was ' + msg); 
     } catch (err) { 
     alert('Oops, unable to copy'); 
     } 
    });