2011-12-19 90 views
0

那么,我只是做一个简单的东西,使用js的execCommand方法执行系统复制,删除等命令。如何使用js粘贴文本行?

我做了两个textareas,并通过点击按钮我执行复制,剪切等命令。

问题:

  1. 在这种粘贴按钮不能正常工作。像我从一个textarea复制一些文本,它不粘贴到其他textarea。

  2. 另外我想做的只是选择textareas。就像如果光标在textarea1上,并且如果我点击了selectAll按钮,它应该只选择textarea1内容。目前它正在选择整个页面内容。

代码:

<script language="javascript"> 
    function doCopy() 
    { 
     document.execCommand('Copy',false,0); 
    } 
    function doPaste() 
    { 
     document.execCommand('Paste'); 
    } 
    function doCut() 
    { 
     document.execCommand('Cut',false,0); 
    } 
    function doSelectAll() 
    { 
     document.execCommand('SelectAll',false,0); 
    } 
    function doDelete() 
    { 
     document.execCommand('Delete',false,0); 
    } 
    function doUndo() 
    { 
     document.execCommand('Undo',false,0); 
    } 
    function doUnselect() 
    { 
     document.execCommand('Unselect',false,0); 
    } 
    </script> 
</head> 
<body> 
<div align="center"> 
    input values : ---- <br> 
<textarea align="left" id="txtArea" name="txtArea" style="width:300px;   height:50px"></textarea> 
<br> 
    <input type="button" id="btnCopy" name="btnCopy" value=" Copy " onclick="doCopy()" /> 
    <input type="button" id="btnCut" name="btnCut" value=" Cut " onclick="doCut()" /> 
    <input type="button" id="btnSelectAll" name="btnSelectAll" value=" Select All " onclick="doSelectAll()" /> 
    <input type="button" id="btnPaste" name="btnPaste" value=" Paste " onclick="doPaste()" /> 
    <input type="button" id="btnDelete" name="btnDelete" value=" Delete " onclick="doDelete()" /> 
<input type="button" id="btnUndo" name="btnUndo" value=" Undo " onclick="doUndo()" /> 
<input type="button" id="btnUnselect" name="btnUnselect" value=" Undo " onclick="doUnselect()" /> 
    <br> 
    Manipulate <br> 
    <textarea align="left" id="txtArea1" onpaste="alert('yes');" name="txtArea1" style="width:300px;height:70px" ></textarea> 
    </div> 

我这样做的IE9。

+0

本网站编辑器非常糟糕...不知道如何粘贴代码部分?真的需要改变。 – Arvind 2011-12-19 10:20:44

+0

请有人编辑我的代码部分...我无法做到这一点。它包含一个HTML示例。 – Arvind 2011-12-19 10:22:26

+0

所以,你想复制到剪贴板或采取一个盒子的内容,并将其放入另一个? – Henry 2011-12-19 11:22:32

回答

2

我不得不做出重大改变,我希望它可以适合你。 这个解决方案需要jQuery。我已经用Chrome和Firefox测试过,但我没有IE9。

var copy = ""; 
    var focused_field = null; 
    $("#btnCopy").click(function(){ 
     //set copy variable to the selected text 
     txtArea = document.getElementById("txtArea"); 
     var start = txtArea.selectionStart; 
     var end = txtArea.selectionEnd; 
     copy = $(txtArea).val().substring(start, end); 
    }); 
    $("#btnCut").click(function(){ 
     //set copy variable to the selected text and cuts it 
     txtArea = document.getElementById("txtArea"); 
     var start = txtArea.selectionStart; 
     var end = txtArea.selectionEnd; 
     copy = $(txtArea).val().substring(start, end); 
     $(txtArea).val(
      $(txtArea).val().substring(0,start)+ 
      $(txtArea).val().substring(end) 
     ); 
    }); 
    $("textarea").focus(function(){focused_field = $(this);}); 
    $("#btnSelectAll").click(function(){ 
     //select all in focused field 
     if(focused_field) 
      focused_field.select(); 
    }); 
    $("#btnPaste").click(function(){ 
     //paste copyed text to manipulate field 
     txtArea1 = document.getElementById("txtArea1"); 
     $(txtArea1).val($(txtArea1).val()+copy); 
    }); 

这里是example

+0

哇!!!!!!!!!!它也在IE9中工作.....谢谢我了。 – Arvind 2011-12-20 05:21:31

+0

复制,粘贴,全选,剪切仍然在Chrome 63中工作..不错..感谢您的代码。 – 2017-12-29 19:27:25