2011-12-19 53 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