Hướng dẫn auto refresh div in php - tự động làm mới div trong php

Question

Tôi đang cố gắng làm mới dữ liệu được lưu trữ trong một div cứ sau 10 giây bằng jQuery.

Nội dung chính Show

tải tự động jQuery
Làm thế nào để bạn làm mới một bảng trong javascript?
Làm cách nào để làm mới một div?
Làm thế nào tôi có thể lấy dữ liệu từ cơ sở dữ liệu trong PHP mà không cần trang làm mới?

Mã HTML của tôi là:

<!DOCTYPE html>
<head>
<title>Untitled Document</title>

<script src="http://code.jquery.com/jquery-latest.js"></script>

<script>
    $(document).ready(function(){
        setInterval(function() {
            $("#latestData").load("getLatestData.php #latestData");
        }, 10000);
    });

</script>
</head>

<body>
    <div id = "latestData">

    </div>
</body>
</html>

Và mã PHP tôi đang sử dụng (tạm thời như tôi biết điều này sẽ không thay đổi do cùng một "dữ liệu"):

<?php

    echo "test";

?>

Tuy nhiên, nó thậm chí không hiển thị "kiểm tra" trên trang HTML .. Có ai có thể đề xuất nơi tôi đã sai không?

Cảm ơn nhiều

Hỏi ngày 14 tháng 4 năm 2013 lúc 12:04Apr 14, 2013 at 12:04

New_programmerNew_programmerNew_programmer

2853 Huy hiệu vàng7 Huy hiệu bạc16 Huy hiệu đồng3 gold badges7 silver badges16 bronze badges

Phương pháp jQuery load hoạt động theo một cách khác. Hãy thử đọc tài liệu của nó.

Bạn không phải chỉ định ID phần tử đích hai lần, xóa cái thứ hai, như thế này:

$("#latestData").load("getLatestData.php");

Đã trả lời ngày 14 tháng 4 năm 2013 lúc 12:08Apr 14, 2013 at 12:08

2

Đây là một cách sẽ giải quyết những gì bạn muốn đạt được, sử dụng phương thức $.get trong jQuery:

$(document).ready(function () {
    setInterval(function() {
        $.get("getLatestData.php", function (result) {
            $('#latestData').html(result);
        });
    }, 10000);
});

Đã trả lời ngày 14 tháng 4 năm 2013 lúc 12:09Apr 14, 2013 at 12:09

Jason Lipojason LipoJason Lipo

7412 Huy hiệu vàng11 Huy hiệu bạc24 Huy hiệu đồng2 gold badges11 silver badges24 bronze badges

Nếu bạn muốn làm mới số lượng tin nhắn, chỉ cần sử dụng mã này:

$(document).ready(function () {
    setInterval(function () {
        $("#ID").load();
    }, 1000);
});

Marcos

16.8K23 Huy hiệu vàng91 Huy hiệu bạc165 Huy hiệu Đồng23 gold badges91 silver badges165 bronze badges

Đã trả lời ngày 10 tháng 9 năm 2014 lúc 7:31Sep 10, 2014 at 7:31

bởi Vincy. Sửa đổi lần cuối vào ngày 13 tháng 7 năm 2022.

Phương thức tải jQuery yêu cầu các trang máy chủ và làm mới bộ chọn HTML với nội dung trang. Trong hướng dẫn này, chúng tôi sẽ tự động tải và làm mới một div với một khoảng thời gian định kỳ.

Hướng dẫn tải tự động jQuery này sẽ giúp làm mới nội dung với các nguồn cấp dữ liệu mới nhất, tải các biểu ngữ quảng cáo ngẫu nhiên, v.v.

Xem bản demo

tải tự động jQuery

Rất ít dòng mã được yêu cầu cho tải tự động jQuery. Và nó là,

$(document).ready(function() {
	setInterval(function() {
		$("#screen").load('banners.php')
	}, 2000);
});

Tệp Php Banners.php được yêu cầu thông qua JQuery AJAX bằng phương thức Load.

Tệp này chứa một mảng mã màu HTML. Một trong những màu đó được chọn bằng Rand Array Rand để thay đổi nền Banner và được tải vào một Div được chỉ định. Mã PHP là,

<?php
$bg_array = array(
    "#CEED9D",
    "#ECED9D",
    "#EDCF9D",
    "#EC9CA7",
    "#ED9DD0",
    "#EE9DE2",
    "#D69DEC",
    "#9E9CEC"
);
$bg = array_rand($bg_array, 1);
?>
<div class="banner" style="background-color:<?php echo $bg_array[$bg];?>;" >
	<div class="txt-title">jQuery DIV Auto Load Refresh</div>
	<div class="txt-subtitle">This Banner auto loads and refreshes every 2
		seconds.</div>
</div>

Sự kiện tải jQuery này xảy ra cứ sau 2 giây để cập nhật biểu ngữ định kỳ. Thay vì sử dụng dữ liệu mảng tĩnh, chúng ta có thể kết nối DB để tải Div với dữ liệu động.

Xem demodownload

Trở lại đầu

Làm thế nào để bạn làm mới một bảng trong javascript?

Một bảng hiển thị dữ liệu, thường là từ truy vấn - nếu bạn muốn tải lại truy vấn bạn có thể.Trigger () nó từ bất kỳ tập lệnh nào hoặc một thành phần khác (như nút tùy chỉnh) hoặc tùy chọn nút Làm mới trong thành phần bảng sẽ làm điều này cho bạn.trigger() it from any script, or another component (like a custom button) or the refresh button option in the table component will do this for you.