API lịch sử HTML5 chắc chắn là cách phù hợp cho các trang web hiện đại. Nó hoàn thành nhiệm vụ trong tầm tay, đồng thời cung cấp chức năng bổ sung. Bạn có thể sử dụng history.pushState[] hoặc history.replaceState[] để sửa đổi URL trong trình duyệt, tùy thuộc vào nhu cầu của bạn
Các đối số cho cả hai phương pháp đều giống nhau, cho phép bạn chuyển một đối tượng state có thể tuần tự hóa tùy chỉnh làm đối số đầu tiên, một title tùy chỉnh [mặc dù hầu hết các trình duyệt sẽ bỏ qua tham số này] và URL bạn muốn thêm/thay thế trong lịch sử của trình duyệt. Hãy nhớ rằng API lịch sử chỉ cho phép các URL có nguồn gốc giống nhau, vì vậy bạn không thể điều hướng đến một trang web hoàn toàn khác
Sử dụng API vị trí
API vị trí cũ hơn không phải là công cụ tốt nhất cho công việc. Nó tải lại trang nhưng vẫn cho phép bạn sửa đổi URL hiện tại và có thể hữu ích khi làm việc với các trình duyệt cũ. Bạn có thể sửa đổi URL bằng cách sử dụng Window.location.href, location.assign[] hoặc location.replace[]
Như bạn có thể thấy, cả ba tùy chọn sẽ khiến trang tải lại, đây có thể là điều không mong muốn. Không giống như API Lịch sử, bạn chỉ có thể đặt URL mà không có bất kỳ đối số bổ sung nào. Cuối cùng, API Vị trí không hạn chế bạn đối với các URL có cùng nguồn gốc, điều này có thể gây ra sự cố bảo mật nếu bạn không cẩn thận
Trong phần này, chúng ta sẽ tìm hiểu tải lại và làm mới trang tự động. Chúng tôi sẽ sử dụng jQuery để làm điều này. Chúng tôi có thể tải lại hoặc làm mới trang được nhúng hoặc trang đang hoạt động theo cách thủ công hoặc tự động với sự trợ giúp của jQuery. Nếu chúng tôi đang phát triển một trang web và chúng tôi muốn thêm tự động làm mới sau một khoảng thời gian, chúng tôi có thể làm điều đó bằng cách sử dụng JavaScript. Chúng tôi có thể sử dụng setTimeout[], thẻ meta http-equiv và setInterval[] để tự động tải lại trang. Có nhiều công nghệ khác nhau như Codeigniter,. Net, PHP, Laravel, Java để tự động tải lại hoặc làm mới trang web
Đôi khi, khi chúng ta làm việc trên một trang, chúng ta cần tải lại trang sau một khoảng thời gian và khoảng thời gian đó có thể là 10 giây, 15 giây, 20 giây, 30 giây, v.v. Trong ví dụ dưới đây, chúng tôi sẽ mô tả các quy trình khác nhau để làm mới trang HTML. Phần này sẽ cung cấp 3 ví dụ để tự động tải lại trang PHP bằng một số phương pháp và làm mới trang PHP bằng JavaScript. Nếu chúng tôi muốn làm mới trang theo cách thủ công, chúng tôi cũng có thể làm điều đó bằng cách chỉ định một số khoảng thời gian
ví dụ 1
Trong ví dụ đầu tiên, chúng ta sẽ sử dụng phương thức setTimeout[] để tự động tải lại và làm mới một trang. Phương thức setTimeout[] nhận hai tham số. Trong tham số đầu tiên, chúng tôi sẽ mô tả một chức năng, được sử dụng để chứa mã tải lại và làm mới trang. Trong đối số thứ hai, chúng tôi sẽ mô tả khoảng thời gian sau đó việc thực thi chức năng diễn ra. Khoảng thời gian phải tính bằng mili giây. Phương pháp này sẽ thực thi chức năng một lần duy nhất
ví dụ 2
Trong ví dụ thứ hai, chúng ta sẽ sử dụng phương thức setInterval[] để tự động tải lại và làm mới một trang. Phương thức setInterval[] nhận hai tham số. Trong tham số đầu tiên, chúng tôi sẽ mô tả một chức năng, được sử dụng để chứa mã tải lại và làm mới trang. Trong đối số thứ hai, chúng ta sẽ mô tả khoảng thời gian, được sử dụng để gọi hàm nhiều lần. Khoảng thời gian phải tính bằng mili giây. Phương thức này lặp đi lặp lại việc thực thi chức năng sau khoảng thời gian nhất định cho đến khi ClearInterval[] được gọi hoặc cửa sổ được đóng lại. Ở đây, chúng tôi không sử dụng bất kỳ phương thức nào để dừng thực thi hàm, được chỉ định trong phương thức setInterval[]. Điều đó có nghĩa là phương thức thực thi chức năng cho đến khi chúng ta đóng cửa sổ
ví dụ 3
Trong ví dụ thứ ba, chúng tôi sẽ sử dụng Meta để tự động tải lại và làm mới trang. Sử dụng thẻ Meta, chúng ta có thể đặt thời gian tính bằng giây. Sau đó, chúng tôi sẽ nhắm mục tiêu trang mà chúng tôi muốn tải lại trong khoảng thời gian đã chỉ định. Nếu chúng ta muốn chuyển một trang sang một trang khác, chúng ta có thể sử dụng URL để thực hiện việc này. Nếu chúng tôi không chỉ định URL, chúng tôi sẽ được tải lại trên cùng một trang
Bây giờ ví dụ trên của chúng tôi đã sẵn sàng để chạy. Khi chúng tôi chạy bất kỳ ví dụ nào trong số này, đầu ra sau sẽ được tạo
Hướng dẫn này sẽ hướng dẫn bạn cách tạo biểu mẫu sẽ gửi thông tin mà không cần làm mới trang biểu mẫu. Thay vào đó, một thông báo sẽ hiển thị khi gửi thành công
Tất cả chúng ta đều thấy rằng khi gửi bất kỳ biểu mẫu web hoặc biểu mẫu liên hệ nào, phải mất vài giây để gửi mà không làm mới trang web. AJAX có khả năng gửi biểu mẫu mà không cần làm mới trang. Chúng tôi cũng sẽ sử dụng AJAX tại đây cùng với jQuery và PHP
Ajax JavaScript jQuery PHP MySQL Trong phần hướng dẫn này, chúng tôi sẽ hướng dẫn bạn cách tải dữ liệu từ cơ sở dữ liệu mà không cần làm mới trang và sau đó hiển thị dữ liệu bằng cách sử dụng Ajax và jQuery. Bạn chỉ cần tải xuống jQuery để lấy dữ liệu từ cơ sở dữ liệu mà không cần làm mới trang. Bạn cũng có thể muốn tải dữ liệu từ cơ sở dữ liệu khi cuộn trang
Vâng, có một vài cách. Thu thập dữ liệu trong Javascript và gửi đến máy chủ bằng AJAX. Ngoài ra, hãy sử dụng Fetch API để gửi đến máy chủ. Cuối cùng, một phương pháp không chính thống
Nếu mục tiêu của bạn là làm mới dữ liệu trang mà không làm mới trang, bạn có thể đặt mã của mình vào bộ hẹn giờ ngắt quãng và để mã tự động làm mới sau mỗi x giây, như bên dưới. setInterval[getAnswer[], 1000]; . setInterval kích hoạt lặp đi lặp lại cho đến khi bạn xóa nó, trong khi setTimeout chỉ kích hoạt một lần
Cách tải dữ liệu từ cơ sở dữ liệu mà không cần làm mới trang bằng Ajax và PHP. 0. WhatsApp. Bài viết trước Cách upload ảnh không cần refresh trang bằng Ajax và PHP
Trong hướng dẫn này, bạn sẽ học cách tải dữ liệu từ cơ sở dữ liệu mà không cần làm mới trang bằng ajax, jquery, mysql và PHP. Dữ liệu sẽ được lấy trong sự kiện jquery. Giả sử chúng ta có bảng “student” chứa tuổi và khóa học và bảng “student” chứa toàn bộ thông tin về sinh viên
Mục đích của bản trình diễn này là tự động tải nội dung mới vào một trang mà không cần làm mới trang. Đó là lãnh thổ AJAX, công nghệ phía máy khách. PHP là công nghệ phía máy chủ, không có khả năng tự động thêm nội dung vào một trang
Nếu trang “tải” hoặc tìm nạp nội dung vẫn bị treo, hãy sử dụng công cụ nhà phát triển mạng của trình duyệt của bạn để xem lỗi treo là gì. Đang xem 1 câu trả lời [trong tổng số 1] Chủ đề 'Làm cách nào để tải lại mà không cần tải lại div của người chơi?' đã không còn nhận được câu trả lời mới
Trong đoạn mã trên, phương thức setInterval[] gọi phương thức refresh_Div[] cứ sau 5 giây [5000 mili giây]. Phương thức này có một mã Ajax sẽ trích xuất dữ liệu XML, từng nút một trong 5 giây một lần và nối nó vào DIV mà không cần tải lại trang
Không có cơ sở dữ liệu, trang web WordPress của bạn sẽ không thể tải và bạn sẽ không thể truy cập bảng điều khiển để tạo bất kỳ nội dung mới nào. Khi cơ sở dữ liệu cũ của bạn không còn nữa, đã đến lúc tạo một cơ sở dữ liệu mới và thiết lập nó cho WordPress
Như bạn có thể thấy, cả ba tùy chọn sẽ khiến trang tải lại, đây có thể là điều không mong muốn. Ngoài ra, bạn chỉ có thể đặt URL mà không có bất kỳ đối số bổ sung nào, không giống như sử dụng API lịch sử. Cuối cùng, API Vị trí không hạn chế bạn đối với các URL có cùng nguồn gốc, đây có thể là nguyên nhân gây ra sự cố bảo mật nếu bạn không cẩn thận
Phương thức pushState[] cho phép bạn cập nhật URL và tạo một mục mới trong lịch sử trình duyệt mà không cần tải lại trang. Vì lịch sử được cập nhật nên URL mới này cũng có thể được thay đổi bằng các nút tiến và lùi của trình duyệt. Đây là cách nó hoạt động
Đôi khi, CSS được lưu vào bộ nhớ cache quá cứng nhắc đến mức thậm chí làm mới toàn bộ trang cũng không giúp được gì. Hôm nay chúng ta sẽ học cách tải lại CSS mà không cần tải lại toàn bộ trang. Sử dụng JavaScript, chúng tôi có thể thêm số phiên bản mới vào đường dẫn tệp CSS dưới dạng tham số truy vấn mỗi khi bạn cập nhật CSS
Trong hai phần trên, nếu bạn muốn tải lại phần cụ thể của trang, thì hãy sử dụng thẻ meta ở trên hoặc cách tiếp cận Javascript trong trang html nguồn khung. Hoặc Bạn có thể sử dụng chức năng “tải lại” khung định kỳ trong chính trang bộ khung