jQuery Mobile - Trang
Người dùng có thể tương tác với các trang jQuery Mobile, nhóm này sẽ nhóm nội dung thành các chế độ xem hợp lý và các chế độ xem trang. Chế độ xem trang có thể được làm động bằng cách sử dụng chuyển đổi trang. Nhiều trang có thể được tạo bằng cách sử dụng tài liệu HTML và do đó, không cần yêu cầu nội dung từ máy chủ.
Bảng sau trình bày chi tiết các loại trang.
| Sr.No. | Loại & Mô tả |
|---|---|
| 1 | Trang đơn Một trang đơn được tạo trong tài liệu HTML bằng cách viết mẫu chuẩn. |
| 2 | Mẫu nhiều trang Nhiều trang có thể được bao gồm trong một tài liệu HTML, tài liệu này sẽ tải cùng nhau bằng cách thêm nhiều div với data-role = "page" . |
| 3 | Trang hộp thoại Hộp thoại phương thức mở nội dung trong lớp phủ tương tác phía trên trang. |
Quy ước, không phải yêu cầu
Các phần tử thuộc tính vai trò dữ liệu như đầu trang, chân trang, trang và nội dung được sử dụng để cung cấp định dạng và cấu trúc cơ bản của một trang.
Đối với tài liệu một trang, trình bao bọc trang được yêu cầu để tự động khởi tạo được đặt làm tùy chọn.
Yếu tố cấu trúc có thể được loại trừ đối với một trang web có bố cục tùy chỉnh.
Để quản lý các trang, trình bao bọc trang được đưa vào bởi khuôn khổ khi nó không được bao gồm bởi đánh dấu.
Tìm nạp trước các trang
Bao gồm tìm nạp trước dữ liệu thuộc tính , chúng tôi có thể tìm nạp trước các trang vào DOM trong các mẫu trang đơn. Để biết thêm thông tin bấm vào đây .
DOM Cache
Khi bộ nhớ trình duyệt đầy trong DOM, thì trình duyệt di động sẽ chậm lại hoặc có thể bị lỗi do tải nhiều trang. Có một phương pháp đơn giản để giữ cho DOM gọn gàng -
Khi một trang được tải qua ajax, thì nó cho biết xóa trang đó khỏi DOM khi bạn chuyển hướng đến một trang khác.
Trang trước mà bạn đã truy cập có thể được truy xuất lại từ bộ nhớ cache khi bạn truy cập lại.
Thay vì xóa các trang, bạn có thể yêu cầu jQuery mobile giữ nó trong DOM bằng cách sử dụng dòng sau:
$.mobile.page.prototype.options.domCache = true;Đặt tùy chọn domCache là true trên plugin trang để giữ tất cả các trang trong DOM, đã được truy cập trước đó.
pageContainerElement.page({ domCache: true });