việc sử dụng thích hợp lệnh execcommand ("dán") trong phần mở rộng của chrome

Question

Tôi đang cố gắng dán dữ liệu clipboard vào vùng văn bản bằng cách sử dụng execcommand("paste") với phần mở rộng chome, nhưng tôi dường như không làm cho nó hoạt động. Các quyền được đặt. Tôi đã cố gắng đặt focus() trên vùng văn bản, nhưng document.execCommand("paste") không làm gì cả và tôi không gặp lỗi. gọi execcommand("paste") từ trang nền cũng không làm gì cả.

<form> 
    <textarea id="ta"></textarea>  
</form> 
<script type="text/javascript"> 
    document.findElemetById("ta").focus(); 
    document.execCommand("paste"); 
</script> 

Answer 1

Chức năng Clipboard là phần quan trọng của my extension vì vậy tôi đã nhìn thấy tất cả các sự cố bình thường. Trên trang nền của tôi, tôi trưng ra một hàm copy và một hàm paste và chính trang đó chứa <textarea id="sandbox"></textarea>;

function copy(str) { 
    var sandbox = $('#sandbox').val(str).select(); 
    document.execCommand('copy'); 
    sandbox.val(''); 
} 

function paste() { 
    var result = '', 
     sandbox = $('#sandbox').val('').select(); 
    if (document.execCommand('paste')) { 
     result = sandbox.val(); 
    } 
    sandbox.val(''); 
    return result; 
} 

Tôi đang sử dụng jQuery để đơn giản nhưng bạn có ý tưởng. Bây giờ bất cứ khi nào tôi muốn sử dụng chức năng clipboard, tôi chỉ cần gọi hàm có liên quan. Các trang khác trong tiện ích của tôi có thể truy cập API này qua chrome.extension.getBackgroundPage() nhưng bạn cũng có thể sử dụng chrome.runtime.getBackgroundPage(callback) nếu trang nền của bạn là event page.

Tôi không chắc đây có phải là phương pháp hay nhất hay không, nếu một điều như vậy vẫn tồn tại đối với chức năng này, nhưng điều này chắc chắn phù hợp với tôi và rất sạch sẽ.

Answer 2

Quá dài để nhận xét về phản hồi tuyệt vời của Alasdair, vì vậy tôi đang tạo một câu trả lời khác. Câu trả lời của Alasdair là tuyệt vời và làm việc tuyệt vời cho tôi, nhưng như một người mới đến các phần mở rộng Chrome nó vẫn mất một thời gian để làm cho nó hoạt động. Đối với bất cứ ai ở một vị trí tương tự, đây là một sự mở rộng về câu trả lời của anh ấy.

Các trang nền/sự kiện có thể tương tác với khay nhớ tạm thời của hệ thống, miễn là bạn đã yêu cầu các quyền thích hợp. Họ không thể tương tác với DOM của các trang mà người dùng đã tải. Tập lệnh nội dung không thể tương tác với khay nhớ tạm thời của hệ thống, nhưng chúng có thể tương tác với DOM của các trang mà người dùng đã tải. Hãy xem explanation of the extension architecture để có cái nhìn tổng quan về tất cả điều này.

Điều này về cơ bản có nghĩa là bạn cần thực hiện các thao tác sao chép/dán từ khay nhớ tạm thời hệ thống trong các trang sự kiện/nền của bạn, đó là những gì Alasdair đã nêu ở trên. Mọi thao tác dán hoặc sao chép từ DOM của trang mà người dùng đang xem phải xuất hiện trong tập lệnh nội dung của bạn. Hai tập lệnh có thể giao tiếp khá dễ dàng với message passing.

Tôi có an extension chỉ có mục đích là dán và kiến ​​trúc chủ yếu đến từ bài đăng này. Nếu bạn muốn xem kỹ thuật trên trong thực tế, take a look at the code. Cụ thể, background.html, background.js và contentscript.js.

Nếu bạn đang thực sự vội vàng, here is a gist.

Answer 3

function PasteString() { 
    var editor = document.getElementById("TemplateSubPage"); 
    editor.focus(); 
    // editor.select(); 
    document.execCommand('Paste'); 
} 

function CopyString() { 
    var input = document.getElementById("TemplateSubPage"); 
    input.focus(); 
    // input..select(); 
    document.execCommand('Copy'); 
    if (document.selection) { 
     document.selection.empty(); 
    } else if (window.getSelection) { 
     window.getSelection().removeAllRanges(); 
    } 
} 

Hy vọng điều này sẽ làm việc cho bạn