Pelaksanaan JS undur dan kesan tatal teks examples_javascript kemahiran

Contoh dalam artikel ini menerangkan cara melaksanakan undur dan kesan menatal teks dengan JS. Kongsikan dengan semua orang untuk rujukan anda. Kaedah pelaksanaan khusus adalah seperti berikut:

Nota: Secara amnya, kita akan melihat beberapa aktiviti seperti membida di beberapa kedai Taobao, yang kadang-kadang kita akan menemui beberapa kesan kira detik Dalam beberapa mesyuarat tahunan dan acara lain, kita juga akan menemui beberapa aktiviti loteri, yang mana kita boleh juga melihat beberapa kesan menatal rawak. Di sini saya ingin berkongsi dengan anda kaedah untuk melaksanakan undur dan menatal teks. Saya harap ia dapat membantu semua orang. Ini terutamanya dilaksanakan melalui js.

1. Pelaksanaan kesan undur

Kod lengkap bahagian hadapan adalah seperti berikut:

Salin kod Kod adalah seperti berikut: Realisasi kesan kira detik Mengira. . . var i = 0; fungsi TimeTo(dd, nowtstr) { var t = new Date(dd), //Dapatkan jumlah bilangan milisaat dalam masa yang ditetapkan n = (Tarikh baharu(nowtstr)) - (-100 * i), //Dapatkan bilangan milisaat semasa c = t - n; //Dapatkan perbezaan masa Jika (c document.getElementById('timer').innerHTML = 'Aktiviti telah tamat'; Clearinterval (tetingkap ['ttt']); // Kosongkan pemasa Kembali; //Tamatkan pelaksanaan } var ds = 60 * 60 * 24 * 1000, //Berapa milisaat dalam sehari d = parseInt(c / ds), //Jumlah milisaat dibahagikan dengan milisaat sehari untuk mendapatkan perbezaan bilangan hari h = parseInt((c - d * ds) / (3600 * 1000)), //Kemudian ambil baki bilangan milisaat selepas bilangan hari dan bahagikannya dengan bilangan milisaat sejam untuk mendapatkan jam m = parseInt((c - d * ds - h * 3600 * 1000) / (60 * 1000)), //Tolak baki milisaat daripada bilangan hari dan jam, dan kemudian bahagikan dengan bilangan milisaat seminit, Dapatkan minit s = parseInt((c - d * ds - h * 3600 * 1000 - m * 60 * 1000) / 1000); //Dapatkan baki milisaat terakhir dibahagikan dengan 1000 untuk mendapatkan bilangan saat dan baki milisaat akan menjadi diabaikan secara automatik Itu sahaja document.getElementById('timer').innerHTML = ' ' d ' ' h ' ;Jam ' m ' ' s ' ' //Akhirnya, rentetan format tetap dikemas kini kepada div pemasa i ; } (fungsi () { tetingkap ['ttt'] = setInterval(fungsi () { // var timestr = " ";//Di sini anda boleh melepasi tarikh akhir aktiviti melalui bahagian belakang ke bahagian hadapan, sila ambil perhatian bahawa ia mestilah dalam format "yyyy-MM-dd" // var nowtstr = " ";//Begitu juga, masa semasa juga boleh dihantar ke bahagian hadapan melalui latar belakang Ambil perhatian bahawa ia juga mestilah dalam format "yyyy-MM-dd " var timestr = "2013-10-21";//Anda juga boleh menyesuaikan masa aktiviti tarikh akhir dalam format "yyyy-MM-dd" var nowtstr = "2013-08-23";//Anda juga boleh menyesuaikan masa semasa dalam format "yyyy-MM-dd" di sini Jika (timestr != "") { TimeTo(timestr, nowtstr); //Tentukan perbezaan masa undur, perhatikan format } }, 100); //Tentukan pemasa, kira dan kemas kini paparan div setiap 100 milisaat, iaitu 1 saat })(); Tambahan: Versi ringkas kesan kira detik:

Salin kod Kod adalah seperti berikut: Realisasi kesan versi undur lite fungsi timestr() { var c = Date.parse("2014-11-11")-Date.parse((New Date())); Jika(c { alert('Acara telah tamat'); clearInterval(aa);//Padam pemasa } var ds = 60 * 60 * 24 * 1000, //Berapa milisaat dalam sehari d = parseInt(c / ds), //Jumlah milisaat dibahagikan dengan milisaat sehari untuk mendapatkan perbezaan bilangan hari h = parseInt((c - d * ds) / (3600 * 1000)), //Kemudian ambil baki bilangan milisaat selepas bilangan hari dan bahagikannya dengan bilangan milisaat sejam untuk mendapatkan jam m = parseInt((c - d * ds - h * 3600 * 1000) / (60 * 1000)), //Tolak baki milisaat daripada bilangan hari dan jam, dan kemudian bahagikan dengan bilangan milisaat seminit, Dapatkan minit s = parseInt((c - d * ds - h * 3600 * 1000 - m * 60 * 1000) / 1000); //Dapatkan baki milisaat terakhir dibahagikan dengan 1000 untuk mendapatkan bilangan saat dan baki milisaat akan menjadi diabaikan secara automatik Itu sahaja document.getElementById('day').innerHTML = ' ' d ' Day

'> document.getElementById('day2'). innerHTML = ' ' h ' document.getElementById('day3').innerHTML = ' ' 分

' document.getElementById('day4').innerHTML = ' ' s ' ' var aa = setInterval(timestr,1000);

Akhirnya kita dapat lihat kesan seperti gambar di bawah:

2. Pelaksanaan kesan tatal teks Bahagian kod bahagian hadapan adalah seperti berikut:

Salin kod

Kod adalah seperti berikut: Pelaksanaan kesan menatal teks fungsi TimeTo(dd) { document.getElementById('TextBox1').value = dd; //Akhir sekali, rentetan format tetap dikemas kini ke dalam kotak teks dengan ID TextBox1 } $(fungsi(){ tetingkap ['ttt'] = setInterval(aaa,100); // Dilaksanakan apabila halaman dimuatkan });

fungsi stopInterval() { clearInterval(tetingkap['ttt']); //Kosongkan pemasa tetingkap['ttt']=""; var aa = "Zhang San, Li Si, Wang Wu, Zhao Liu, Sun Qi, Hu Ba, Zeng Jiu, Liu Shi, Yi Yi, Pu Er"; var arr = aa.split(','); var rdd = 9 * Math.random(); var leth = Math.round(rdd); var leths = arr[leth].toString(); document.getElementById('TextBox1').value = leths; } Fungsi aaa() { var aa = "Zhang San, Li Si, Wang Wu, Zhao Liu, Sun Qi, Hu Ba, Zeng Jiu, Liu Shi, Yi Yi, Pu Er"; var arr = aa.split(','); var rdd = 9 * Math.random(); var leth = Math.round(rdd); var leths = arr[leth].toString(); TimeTo(leths) Fungsi TimeTo2(){ Jika(tetingkap['ttt']==""){ tetingkap['ttt'] = setInterval(aaa,100); } }

Paparan akhir adalah seperti berikut:

Tambahan ilmu:

var myDate = new Date();

myDate.getYear(); //Dapatkan tahun semasa (2 digit) myDate.getFullYear(); //Dapatkan tahun lengkap (4 digit, 1970-????) myDate.getMonth(); //Dapatkan bulan semasa (0-11, 0 mewakili Januari) myDate.getDate(); //Dapatkan hari semasa (1-31) myDate.getDay(); //Dapatkan minggu semasa X (0-6, 0 mewakili Ahad) myDate.getTime(); //Dapatkan masa semasa (bilangan milisaat sejak 1970.1.1) myDate.getHours(); //Dapatkan waktu semasa (0-23) myDate.getMinutes(); //Dapatkan minit semasa (0-59) myDate.getSeconds(); //Dapatkan saat semasa (0-59) myDate.getMilliseconds(); //Dapatkan bilangan milisaat semasa (0-999) myDate.toLocaleDateString(); //Dapatkan tarikh semasa var mytime=myDate.toLocaleTimeString(); //Dapatkan masa semasa myDate.toLocaleString( ); //Dapatkan tarikh dan masa

Saya harap artikel ini akan membantu pengaturcaraan web semua orang berdasarkan js.