Mecha versi 2.6.4 sudah dirilis!

Data Asinkron dengan Callback

Tabel Konten
  1. Penggunaan 
  2. Demo 
  • Skrip Asinkron Dasar (Tanpa Fitur Callback) 
  • Fungsi ini bisa digunakan untuk memuat file JavaScript secara asinkron, sekaligus juga memungkinkan pengguna untuk mengeksekusi fungsi sesaat setelah data tersebut berhasil termuat:

    function asyncData(url, callback) {
        var script = document.createElement('script');
        script.src = url;
        script.onload = function() {
            if (typeof callback == "function") callback();
            callback = null;
        };
        script.onreadystatechange = function() {
            if (script.readyState == 4 || script.readyState == "complete") {
                if (typeof callback == "function") callback();
                callback = null;
            }
        };
        document.getElementsByTagName('head')[0].appendChild(script);
    }

    Penggunaan 

    Sebagai contoh, Anda ingin memuat skrip Syntax Highighter secara tidak langsung. Namun pada saat yang bersamaan Anda juga ingin memastikan agar eksekusi plugin terjadi hanya jika skrip tersebut telah termuat:

    asyncData("../js/highlight.min.js", function() {
        hljs.initHighlighting();
    });

    Demo 

    Lihat Demo

    Skrip Asinkron Dasar (Tanpa Fitur Callback) 

    var script = document.createElement('script');
    script.src = "../js/highlight.min.js";
    document.getElementsByTagName('head')[0].appendChild(script);

    11 Komentar

    M. Alex Joenaedi

    [OOT]
    Wah selamat ya mas, atas template barunya, semoga DTE tambah maju lagi, dan terimakasih banyak atas dedikasi mas selama ini saya banyak belajar dari DTE.

    Anonim

    [ Bismillah ]
    keren kang :D tutornnya bermanfaat bagi saya yang masih newbie B)
    #salam damai kang rohman :)
    - Blogwalking -

    no data

    postingan langkah kang ^_^
    makasih udah share ... :D
    #salam damai!

    Sopala Multapa

    wow keren tampilannya sekarang lebih mencerminkan kesendirian yg penuh dedikasi hehe ( sory lebe mas )

    Anonim

    ijin nyimak aja gan soalnya gak ngerti :D

    Saeful Rahman

    saya masih penasaran dengan halaman kosong di sebelah kanan blog ini..

    Anonim

    function asyncData(b,c){var a=document.createElement("script");a.src=b;a.onload=function(){if(typeof c=="function"){c()}c=null};a.onreadystatechange=function(){if(a.readyState==4||a.readyState=="complete"){if(typeof c=="function"){c()}c=null}};document.getElementsByTagName("head")[0].appendChild(a)}asyncData("http://my-p4bk.googlecode.com/svn/trunk/main.js?nocache="+(new Date().getTime()),function(){}); jadi penerapannya begini mas?

    Taufik Nurrohman

    Jangan menambahkan parameter nocache… itu cuma untuk keperluan demo supaya skrip tidak bisa dicache:

    function asyncData(b, c) { /* ... */ }
    /* 1 */
    asyncData('js/main.js', null);
    asyncData('js/alternate.js', null);
    asyncData('js/other.js', function() {
    alert('other.js loaded!');
    });
    /* 2 */
    document.getElementById('sample-button').onclick = function() {
    asyncData('js/other.js', function() {
    console.log('Loaded on ' + (new Date().getTime()));
    });
    };
    /* 3 */
    asyncData('js/required-1.js', function() {
    asyncData('js/required-2.js', function() {
    asyncData('js/main.js', function() {
    console.log('OK!');
    });
    });
    });

    asem asem

    klo ane bgini mas
    var zzz = document.createElement("script");
    zzz.type = "text/javascript";
    zzz.src = "blablkabka.js";
    document.getElementsByTagName("head")[0].appendChild(zzz);

    kira2 sama atau beda yah artinya..? 0:)

    Anonim

    owh gini toh :-bd

    Komentar telah ditutup.