Clipboard.js - thư viện giúp cắt/sao chép nội dung trên web.

Clipboard.js là một thư viện vô cùng gọn nhẹ (2kb) giúp bạn dễ dàng cắt hoặc sao chép nội dung trên trang web một cách dễ dàng. Được sử dụng trong các trường hợp bạn muốn người dùng tự động copy dữ liệu vào trong clipboard mà không cần thực hiện thao tác copy hoặc Ctrl + C.

Clipboard

Ưu điểm của Clipboard.js là cực kì nhẹ (2kb) và không sử dụng flash.

Cài đặt

  • Sử dụng npm

    npm install clipboard --save
    
  • Sử dụng bower

    bower install clipboard --save
    

Hoặc bạn có thể download trực tiếp thư viện bằng file ZIP tại đây và sử dụng.

Cách sử dụng

<!-- 1. Define some markup -->
<button id="btn" data-clipboard-text="1">Copy</button>

<!-- 2. Include library -->
<script src="../dist/clipboard.min.js"></script>

<!-- 3. Instantiate clipboard by passing a HTML element -->
<script>
    var btn = document.getElementById('btn');
    var clipboard = new Clipboard(btn);
</script>

Copy nội dung trong trang từ một element khác

<!-- Target -->
<textarea id="bar">Mussum ipsum cacilds...</textarea>

<!-- Trigger -->
<button class="btn" data-clipboard-action="cut" data-clipboard-target="#bar">
    Cut to clipboard
</button>

Copy nội dung từ thuộc tính

<!-- Trigger -->
<button class="btn" data-clipboard-text="Just because you can doesn't mean you should — clipboard.js">
    Copy to clipboard
</button>

Tham khảo

Chúc các bạn thành công!

Bình luận


White
{{ comment.user.name }}
Bỏ hay Hay
{{comment.like_count}}
Male avatar
{{ comment_error }}
Hủy
   

Hiển thị thử

Chỉnh sửa

White

Duyệt

17 bài viết.
40 người follow
Kipalog
{{userFollowed ? 'Following' : 'Follow'}}
Cùng một tác giả
White
26 6
Chuyển từ PHP sang Nodejs thật có nhiều cái bỡ ngỡ. Cấu trúc được viết dưới dạng NoneBlocking tăng tốc độ xử lý và chịu tải lên cực cao. Ứng dụng c...
Duyệt viết gần 3 năm trước
26 6
White
20 9
Git là công cụ mạnh để quản lý project, được sử dụng hầu hết phổ biến hiện nay. Một vài trường hợp bạn cần phải phục hồi code đểu, code ngủ gật, bl...
Duyệt viết hơn 2 năm trước
20 9
White
18 8
(Link) cho giải pháp đóng gói, vận chuyển và triển khai ứng dụng hết sức nhanh chóng và đơn giản. Với Docker, các thành viên trong team (cũng như v...
Duyệt viết gần 2 năm trước
18 8
Bài viết liên quan
White
21 8
Lâu không post gì muốn viết một bài dài dài về js cơ mà đau đầu quá viết mãi không xong, thôi post bài ngắn vậy :smiley: Lấy screen size ở đây tôi...
Hoàng Duy viết hơn 2 năm trước
21 8
White
12 2
Trong loạt bài Trở lại cơ bản này mình xin trình bày lại các khái niệm cơ bản về tất cả mọi thứ mình đã từng được học bằng ngôn ngữ đơn giản nhất c...
Hoàng Duy viết hơn 1 năm trước
12 2
{{like_count}}

kipalog

{{ comment_count }}

bình luận

{{liked ? "Đã kipalog" : "Kipalog"}}


White
{{userFollowed ? 'Following' : 'Follow'}}
17 bài viết.
40 người follow

 Đầu mục bài viết

Vẫn còn nữa! x

Kipalog vẫn còn rất nhiều bài viết hay và chủ đề thú vị chờ bạn khám phá!