Archives Code

Arsip atau kumpulan kode penting untuk tujuan pengembangan website gratis

  • Home
  • Java
  • wordpress
  • Blogspot
  • Tutorial
  • Other
Beranda » html » javascript » php » web » Menampilkan Jam Secara Realtime dengan javascript dan php

Menampilkan Jam Secara Realtime dengan javascript dan php

Menampilkan Jam Secara Realtime dengan javascript dan php
Archives code
Halo juragan coding semua?? Sudah minum kopi belum?? Disini tidak disuguh kopi ya, bawa sendiri sendiri ya..wkwkwk

Serius gan, becanda saja,,hehehe, oke pada kesempatan kali ini kami dari team archives code akan menjelaskan cara menampilkan jam secara realtime dengan javascript dan php dengan mudah dan gampang punya

Fasilitas yang sering dilupakan oleh para pengembang web adalah fasilitas jam yang secara realtime sehingga pengunjung akan mengetaui jam berapa sekarang.

Cara menampilkan tanggal dengan php adalah dengan memanfaatkan function date yang telah disediakan oleh php

code :
<?php print date('d F Y');  // menghasilkan 04 September 2012 ?>

Begitu juga ketika kita ingin menmpilkan jam dengan php yaitu dengan menggunakan function date
code :
<?php print date('H:i:s');  //hasilnya misalnya : 08:30:45 ?>
Tapi karena PHP adalah server side script, programnya dijalankan di server, maka tampilan waktu yang muncul tidak akan pernah berubah selama tidak dilakukan request ulang ke server, padahal seharusnya tampilan detiknya haruslah berubah setiap detiknya. Oleh karena itulah maka dibutuhkan JavaScript yang merupakan client side script, untuk menampilkan jam ini.

maka solusi nya adalah dengan menggunakan javascript. Sebagai contoh kode nya

<!DOCTYPE html>
<head>
<title></title>
<script type="text/javascript">
    //set timezone
    <?php date_default_timezone_set('Asia/Jakarta'); ?>
    //buat object date berdasarkan waktu di server
    var serverTime = new Date(<?php print date('Y, m, d, H, i, s, 0'); ?>);
    //buat object date berdasarkan waktu di client
    var clientTime = new Date();
    //hitung selisih
    var Diff = serverTime.getTime() - clientTime.getTime();    
    //fungsi displayTime yang dipanggil di bodyOnLoad dieksekusi tiap 1000ms = 1detik
    function displayServerTime(){
        //buat object date berdasarkan waktu di client
        var clientTime = new Date();
        //buat object date dengan menghitung selisih waktu client dan server
        var time = new Date(clientTime.getTime() + Diff);
        //ambil nilai jam
        var sh = time.getHours().toString();
        //ambil nilai menit
        var sm = time.getMinutes().toString();
        //ambil nilai detik
        var ss = time.getSeconds().toString();
        //tampilkan jam:menit:detik dengan menambahkan angka 0 jika angkanya cuma satu digit (0-9)
        document.getElementById("clock").innerHTML = (sh.length==1?"0"+sh:sh) + ":" + (sm.length==1?"0"+sm:sm) + ":" + (ss.length==1?"0"+ss:ss);
    }
</script>
</head>
<body onload="setInterval('displayServerTime()', 1000);">
Waktu Server (Timezone: Asia/Jakarta):<br/>
<span id="clock"><?php print date('H:i:s'); ?></span>
</body>
</html>

Coba jalankan script anda jika sudah benar harus nya sudah jalan 

Sudah ngantuk juragan,, kopinya sudah habis 3 cangkir, maka artikel tentang cara menampilkan jam secara realtime dengan javascript dan php resmi ditutup..wkwkwk

Apabila ada yang perlu dibisikkan silahkan bisikin pada kolom komentar ya gan

Okay, selamat mencoba dan semoga sukses menyertai agan semua, jangan lupa mampir pada artikel seru lainnya ya gan

Related post:

Newer Post
Older Post
Home

Popular Posts

  • Mengatasi Status Disconnect di Kalkun Terupdate 2018
    Selamat malam dan selamat begadang untuk para mastah sekalian, jangan lupa sruput kopinya sebelum membaca artikel ini, hehe Pada w...
  • Cara mengirim email di wordpress dengan wp_mail()
    halo sobat archives code, pada kesempatan kali ini kami akan menjelaskan tentang cara mengirim email di wordpress dengan wp_mail() . belu...
  • 5 Cara Menurunkan RKT Halaman Pada Adsense Terbaru
    Halo sahabat archivescode yang berbahagia dimanapun kalian berada, bertemu lagi dengan kita yang selalu memberi info kekinian tentang blog,...
  • Cara Mengembalikan Visitor Blog Yang Menghilang dengan mudah
    ARCHIVESCODE - Setelah kita membuat suatu blog dengan susah payah siang malam tidak tidur maka saatnya para pengunjung blog setia akan data...
  • ( NEW ) Menampilkan Tanggal Sekarang Dengan php 2018
    Selamat pagi  pembaca yang selalu aktif dalam mencari artikel artikel yang bermanfanfaat untuk pengembangan web anda. Baiklah pembaca...
  • ( NEW ) Cara Menambahkan Fanspage di Blogspot Dengan Mudah 2018
    Halo sobat coding semua, pada kesempatan yang baik kali ini kami akan menuliskan artikel tentang Cara Menambahkan Fanspage di Blogspot deng...
  • 6 Sebab Pengunjung Blog Menurun Tajam ( Penelitian ) Terbaru
    Hai kamu yang baru saja mengunjungi web sederhana ini, semoga akan betah lama-lama di blog ini, karena banyak info bagus yang mungkin kamu...
  • Daftar Kode Warna HTML Lengkap Terbaru 2018
    ARCHIVESCODE - Halo sobat coding dimanapun kalian berada, pada kali ini kita akan membagikan beberapa kode HTML warna yang tentunya sangat...
  • Mengatasi error THIS EMAIL ADDRESS DOES NOT BELONG TO THE SAME DOMAIN AS THE SITE pada Contact form 7
    Mengatasi error THIS EMAIL ADDRESS DOES NOT BELONG TO THE SAME DOMAIN AS THE SITE pada Contact form 7 Pernah mengalami error THIS EMAIL A...
  • Cara mengatasi A valid feed URL is required: Feed exceeds 512KB size limit pada dlvr.it
    pernahkah anda mengalami error  A valid feed URL is required: Feed exceeds 512KB size limit  pada saat menghubungkan facebook dan DLVR...
Copyright © 2014 Archives Code - Powered by Blogger
Template by Mas Sugeng - Versi Seluler