Sử dụng printThis plugin jQuery để in một phần nội dung trang web.

Để in nội dung 1 trang web có khá nhiều cách, tuy nhiên printThis là một plugin mình thấy đơn giản và dễ sử dụng nhất, nó cho phép mình lựa chọn in một phần của trang web dựa vào class hoặc id của thẻ html bao ngoài nội dung cần in

- Các bạn có thể download plugin tại đây hoặc ở file đính kèm cuối bài viết.

- Plugin này cho phép bạn lựa chọn in một phần nội dung văn bản trên trang html. Ví dụ như đoạn html dưới đây.

<body>
    <form id="form1" runat="server">
        <div class="div-full div-not-print" style="padding: 20px 0; text-align: center;">
            <input type="button" id="btPrint" value="In hóa đơn chuyển đổi" style="padding: 5px 10px;" />
        </div>
        <div class="div-full" id="contentInvoice">
            Nội dung văn bản cần in....
        </div>
        <div class="div-full div-not-print">
            <asp:Literal ID="ltrMs" runat="server"></asp:Literal>
        </div>
    </form>
</body>

- Để in nội dung văn bản trong thẻ có id="contentInvoice" ta chỉ cần 1 đoạn script nhỏ như sau.

<script src="js/jquery.min.js"></script>
    <script src="js/printThis.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#btPrint').click(function () {
                $("#contentInvoice").printThis();
            });
        });
    </script>

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

Download Source

Related Post


Tích hợp google maps vào website
Tuesday, May 13, 2014
Trong bài này mình muốn giới thiệu một đoạn code nhỏ để tích hợp google maps vào website các bạn, cái này phù hợp để tích hợp vào trang liên hệ của 1 website, khi người dùng vào có thể thấy được ví trí công ty trên maps một cách rất trực quan
Giải Pháp Responsive Cho Video Trên Trang Web Của Bạn
Friday, March 14, 2014
Một trong những khó khăn trong việc thiết kế responsive là quản lý các plugin/resource bên ngoài, chẳng hạn như các video Youtube và Vimeo – chúng sử dụng embed iframe mà chúng ta thường copy và nhúng vào trong các trang web. Đây là một vấn đề mà bạn không thể kiểm soát được. Làm việc với các iframe đôi khi thật khó khăn, đặc biệt là với video và việc duy trì tỷ lệ khía cạnh. Có một số thủ thuật CSS mà chúng ta cố gắng làm responsive cho các iframe video, nhưng không thành công.
Search

Đăng ký nhận bài mới


Category

Blog Archive