Membuat Jam Berjalan dengan PHP dan Jquery AJAX

Halo teman – teman,

Kali ini saya akan menjelaskan bagaimana membuat jam berjalan mengunakan PHP Dan Jquery AJAX, sebelum membuat jam berjalan kita harus terlebih dahulu tau apa itu AJAX.

AJaX adalah suatu teknik pemrograman berbasis web untuk menciptakan aplikasi web interaktif. Tujuannya adalah untuk memindahkan sebagian besar interaksi pada komputer web surfer, melakukan pertukaran data dengan server di belakang layar, sehingga halaman web tidak harus dibaca ulang secara keseluruhan setiap kali seorang pengguna melakukan perubahan. Hal ini akan meningkatkan interaktivitas, kecepatan, dan usability. Wikipedia

Sederhananya begini, AJAX itu berfungsi untuk melakukan akses sebuah halaman dan dapat megambil data tanpa berpindah halaman atau melakukan refresh pada browser.

disini kita menggunakan Jquery untuk memakai fitur AJAXnya.

Oke langsung saja, Pertama kita membuat file ajax_timestamp.php


<?php
date_default_timezone_set('Asia/Jakarta');//Menyesuaikan waktu dengan tempat kita tinggal
echo $timestamp = date('H:i:s');//Menampilkan Jam Sekarang
?>

File diatas akan kita panggil menggunakan Jquery AJAX

Lalu kita membuat file index.php


<!DOCTYPE html>
<html>
<head>
<title>Jam PHP AJAX</title>
<script
src="https://code.jquery.com/jquery-2.2.4.min.js"
integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
crossorigin="anonymous"></script>
</head>
<body>

<h2 id="timestamp"></h2>

<script>
// Function ini dijalankan ketika Halaman ini dibuka pada browser
$(function(){
setInterval(timestamp, 1000);//fungsi yang dijalan setiap detik, 1000 = 1 detik
});

//Fungi ajax untuk Menampilkan Jam dengan mengakses File ajax_timestamp.php
function timestamp() {
$.ajax({
url: 'ajax_timestamp.php',
success: function(data) {
$('#timestamp').html(data);
},
});
}
</script>
</body>
</html>

Jalan program menggunnakan Web server maka hasil seperti berikut:

Happy Coding 🙂

 

 

4 Comments

    1. jangan lupa buat ajax_timestamp.php nya dulu dan pastikan php nya jalan

      Terima kasih sudah berkunjung 🙂

  1. izin tanya ka, jika di localhost berjalan normal, tapi pada saat saya upload ke hosting tidak berjalan normal (detik tidak jalan)

Leave a Reply

Your email address will not be published. Required fields are marked *