2012-01-11 41 views
5

Tôi có một trang web nơi người dùng nhấp vào nút đọc nhiều hơn để họ có thể xem phần còn lại của thông tin trên trang. Tôi tò mò làm thế nào tôi có thể làm cho nó để người dùng không phải in mỗi trang một cách riêng biệt. Tôi muốn có thể làm cho nó để tôi có thể có một kịch bản in các trang liên quan. Tôi có ai đó có thể giúp tôi và chỉ cho tôi đúng hướng nó sẽ được đánh giá cao. Tôi cần chức năng này để làm việc trong tất cả các trình duyệt.In nhiều trang bằng Javascript

Cảm ơn

+2

Thay thế "nút đọc thêm" bằng thanh cuộn được tích hợp trong trình duyệt. – Quentin

Trả lời

3

Điều bạn sẽ cần phải gỡ bỏ này là biểu định kiểu sử dụng kiểu phương tiện. Về cơ bản nó giống như có hai bản định kiểu riêng biệt; một cho in ấn và một cho xem. Để bảo thủ băng thông, hãy để trống printarea cho đến khi yêu cầu được thực hiện. Khi sự kiện yêu cầu điền vào số printarea với toàn bộ bản in bạn cần làm. Tôi sẽ đề nghị bạn nhìn vào jQuery và tải của họ và yêu cầu ajax cho việc này.

@media screen 
    { 
    #screenarea 
     { 
     display: block; 
     } 
    #printarea 
     { 
     display: none; 
     } 
    } 
@media print 
    { 
    #screenarea 
     { 
     display: none; 
     } 
    #printarea 
     { 
     display: block; 
     } 
    } 
0

cảm giác ruột của tôi đầu tiên nói với tôi rằng nó sẽ đòi hỏi một giải pháp dựa trên máy chủ, vì window.print chức năng chỉ in những gì có trong tài liệu hiện tại, và rằng bạn nên viết mã máy chủ để tạo ra một trang web bao gồm tất cả các trang bạn muốn in và gọi window.print từ trang đó.

Nhưng bạn có thể làm cho jQuery hoạt động cho bạn, tải xuống các trang cần in bằng chức năng .load và sau đó sau khi tất cả các trang được tải, hãy gọi window.print. Nếu bạn không thể sử dụng jQuery vì lý do nào đó, bạn có thể tự viết toàn bộ hệ thống ống nước bằng XHR.

Rất khó để cung cấp câu trả lời chi tiết hơn mà không có bất kỳ thông tin nào về cấu trúc ứng dụng web của bạn.

0

Trong nói chung, bạn sẽ không sử dụng JavaScript để truy cập nhiều trang và in chúng. (Nếu nó thậm chí có thể, có vẻ như nó sẽ hơi khó khăn.)

Thay vào đó, bạn có thể muốn có một trang chứa tất cả thông tin được in, được tạo kiểu CSS cho printability, mà người dùng sẽ xem và có thể in. (Trong trường hợp này, bạn có thể dễ dàng sử dụng JavaScript để bắt đầu hành động in.)

Có thể là liên kết "in tất cả" hướng người dùng đến trang (hoặc mở một trang mới target) chứa tất cả thông tin Để in?

Bạn thậm chí có thể tiến thêm một bước nữa và làm cho nó năng động hơn một chút. Có thể có các hộp kiểm bên cạnh các tiêu đề cho từng phần thông tin và một nút để "in đã chọn" sẽ đăng các lựa chọn lên máy chủ và chỉ hiển thị thông tin đã chọn cho trang "in tất cả". Tôi chỉ cảm thấy rằng, với tư cách là người dùng, điều này sẽ tuân thủ nhiều hơn là least astonishment so với nội dung in mà tôi thậm chí không tải xuống ở nơi đầu tiên (nơi bạn cũng có nguy cơ gửi quá nhiều đến máy in của người dùng). lãng phí nguồn lực của họ).

Sửa:

Một cách tiếp cận mà chỉ xảy ra với tôi. Tất cả nội dung có cần phải nằm trên các trang riêng biệt ngay từ đầu không? Có thể chỉ cần đặt nội dung theo số div s được ẩn theo mặc định và liên kết "đọc thêm" hiển thị số liên kết div. Sau đó, tất cả những gì bạn cần cho khả năng in là kiểu phương tiện CSS nói trên. Khi xem trong trình duyệt, họ có thể mở rộng/thu gọn các phần thông tin riêng lẻ, nhưng khi trang được in mọi thứ được mở rộng.

0

Sau khi bạn có tất cả nội dung của bạn trong một trang web duy nhất (bằng cách sử dụng tiêm hoặc một quá trình máy chủ), định dạng trang sử dụng CSS thuộc tính cho in @media, ví dụ:

@media print { 
    h1 {page-break-before: always;} 
} 

thuộc tính khác là "trang của bạn- break-after "và" page-break-inside ", phần sau sẽ giúp tránh các ngắt bên trong nội dung.

Các vấn đề liên quan