Tự động làm mới div bằng JavaScript

Chúng tôi đã thực hiện hướng dẫn này về cách tự động làm mới nội dung div bằng cách sử dụng JQuery và Ajax với PHP Script. Chúng tôi đã sử dụng phương thức tải JQuery (), gửi yêu cầu đến máy chủ và tìm nạp dữ liệu từ máy chủ và bằng cách sử dụng bộ chọn Jquery, chúng tôi có thể làm mới nội dung div HTML mà không cần làm mới trang.

Trong hướng dẫn này, chúng ta sẽ học cách tự động làm mới nội dung div theo định kỳ bằng cách sử dụng phương pháp JQuery và Ajax trong lập trình PHP. Trong hướng dẫn này, trước tiên chúng ta sẽ Chèn hoặc tạo dữ liệu vào bảng Mysql bằng cách sử dụng phương thức Ajax Jquery trong PHP. Sau khi Chèn dữ liệu vào cơ sở dữ liệu, sau đó sử dụng phương thức Jquery load() để lấy dữ liệu từ cơ sở dữ liệu. Sau đó, sau khi phương thức load() này đã được sử dụng trong Jquery setInterval(), phương thức này sẽ thực thi phương thức load() theo khoảng thời gian đều đặn cho đến khi chúng ta gọi ClearInterval(). Vì vậy, theo cách này, chúng ta có thể Tự động tải và làm mới nội dung div trên mọi khoảng thời gian xác định trước với Jquery và Ajax.

Xem thêm

• Tự động làm mới nội dung Div bằng AngularJS trong PHP

Mã nguồn

mục lục. php

 
  
  
  
   href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
  
 
 
   class="container box">
    name="add_tweet" method="post">
     align="center">Tweet Page
     class="form-group">
      name="tweet" id="tweet" class="form-control" rows="3">
    

//insert.php
if(isset($_POST["tweet"]))
{
 $connect = mysqli_connect("localhost", "root", "", "testing");
 $tweet = mysqli_real_escape_string($connect, $_POST["tweet"]);
 $sql = "INSERT INTO tbl_tweet (tweet) VALUES ('".$tweet."')";
 mysqli_query($connect, $sql);
}

?>

//fetch.php
$connect = mysqli_connect("localhost", "root", "", "testing");
$query = "SELECT * FROM tbl_tweet ORDER BY tweet_id DESC";
$result = mysqli_query($connect, $query);
if(mysqli_num_rows($result) > 0)
{
 while($row = mysqli_fetch_array($result))
 {
  echo '
'.$row["tweet"].'
';
}
}
?>