jQuery Almanac Lama Kaedah Pelaksanaan Lengkap

Contoh dalam artikel ini menerangkan kaedah pelaksanaan almanak lama jQuery. Kongsikan dengan semua orang untuk rujukan anda. Kaedah pelaksanaan khusus dianalisis seperti berikut:

Mari kita lihat kesan larian program:

Bahagian halaman html adalah seperti berikut:

Salin kod Kod adalah seperti berikut:

jquery kesan khas almanak lama -

Pengaturcara Lao Huangli^beta

Orientasi tempat duduk: Face

Minuman hari ini:

Indeks kedekatan Dewi:

gaya.css gaya adalah seperti berikut:

Salin kod Kod adalah seperti berikut:

badan * {
font-family:"Consolas","Microsoft Yahei", Arial, sans-serif;
}

badan {
latar belakang: putih;
jidar: 0;
pelapik: 0;
}

.bekas {
lebar: 320px;
jidar: 0 automatik 50px;
}

.bekas>.tajuk {
warna: #bbb;
berat fon: tebal;
jidar bawah: 10px;
latar belakang: #555;
pelapik: 5px 15px;
}

.tarikh{
saiz fon:17pt;
berat fon: tebal;
ketinggian garisan: 30pt;
penjajaran teks: tengah;
}

.belah, .jelas {
jelas: kedua-duanya;
ketinggian: 1px;
limpahan-y: tersembunyi;
}

.baik, .buruk {
jelas: kedua-duanya;
jawatan: relatif;
}

.buruk {
/*atas: -1px;*/
}

.tajuk .baik, .tajuk .buruk {
terapung: kiri;
lebar: 100px;
berat fon: tebal;
penjajaran teks: tengah;
saiz fon: 30pt;
kedudukan:mutlak;
atas:0;
bawah:0;
}

.jadual .tajuk>baik, jadual .buruk .tajuk>jadual {
kedudukan:mutlak;
lebar:100%;
ketinggian:100%;
sempadan:tiada;
}

.bagus .tajuk {
latar belakang: #ffee44;
}

.tajuk .buruk {
latar belakang: #ff4444;
warna: #fff;
}

.kandungan .baik, .kandungan .buruk {
jidar-kiri: 115px;
padding-kanan: 10px;
padding-top: 1px;
saiz fon:15pt;
}

.baik {
latar belakang: #ffffaa;
}

.buruk {
latar belakang: #ffddd3;
}

.kandungan ul {
gaya senarai: tiada;
jidar:10px 0 0;
pelapik:0;
}

.kandungan ul li {
ketinggian garis:150%;
saiz fon: 15pt;
berat fon: tebal;
warna: #444;
}

.kandungan ul li div.keterangan {
saiz fon: 10pt;
berat fon: biasa;
warna: #777;
ketinggian garis: 110%;
jidar bawah: 10px;
}

.petua baris {
saiz fon: 11pt;
jidar atas: 10px;
jidar-kiri: 10px;
}

.nilai_arah {
warna:#4a4;
berat fon: tebal;
}

.komen {
jidar atas: 50px;
saiz fon: 11pt;
jidar-kiri: 10px;
}

.komen ul {
jidar-kiri: 0;
padding-left: 20px;
warna: #999;
}

almanac.js代码如下：

复制代码代码如下:

/*
* Nota: "Rawak" dalam program ini ialah konsep pseudo-rawak, dengan hari semasa sebagai benih.
*/
fungsi rawak(dayseed, indexseed) {
var n = biji hari % 11117;
untuk (var i = 0; i < 100 indexseed; i ) {
n = n * n;
n = n % 11117; // 11117 ialah nombor perdana
}
pulangkan n;
}

var hari ini = Tarikh baharu();
var iday = today.getFullYear() * 10000 (today.getMonth() 1) * 100 today.getDate();

var specials = [
{tarikh:20130221, taip:'baik', nama:'latihan pertahanan nuklear', perihalan:'Bagaimana jika ada orang gila menjatuhkan bom nuklear...'}
];

var tools = ["Eclipse menulis program", "MSOffice menulis dokumen", "Notepad menulis program", "Windows8", "Linux", "MacOS", "IE", "Android devices", "iOS devices " ];

var varNames = ["jieguo", "huodong", "pay", "expire", "zhangdan", "every", "free", "i1", "a", "virtual", "ad" , "labah-labah", "mima", "pass", "ui"];

minuman var = ["air","teh","teh hitam","teh hijau","kopi","teh susu","kok","susu","susu soya","jus" ,"buah" "Soda", "soda", "minuman sukan", "yoghurt", "wain"];

fungsi getTodayString() {
kembalikan "Hari ini ialah" hari ini.getFullYear() "Year" (today.getMonth() 1) "Bulan" hari ini.getDate() "Hari Minggu" minggu[today.getDay()];
}

// 生成今日运势
function pickTodaysLuck() {
var numGood = rawak(iday, 98) % 3 2;
var numBad = rawak(iday, 87) % 3 2;
var eventArr = pickRandomActivity(numGood numBad);
var specialSize = pickSpecials();
untuk (var i = 0; i < numGood; i ) {
addToGood(eventArr[i]);
}
untuk (var i = 0; i < numBad; i ) {
addToBad(eventArr[numGood i]);
}
}

// 添加预定义事件
function pickSpecials() {
var specialSize = [0,0];

untuk (var i = 0; i < specials.length; i ) {
  var special = istimewa[i];

  if (iday == special.date) {
   if (special.type == 'good') {
    Saiz istimewa[0] ;
    addToGood({name: special.name, good: special.description});
   } lain {
    Saiz istimewa[1] ;
    addToBad({name: special.name, bad: special.description});
   }
  }
}
pulangkan specialSize;
}

// 从 aktiviti 中随机挑选 saiz 个
function pickRandomActivity(saiz) {
var picked_events = pickRandom(aktiviti, saiz);
untuk (var i = 0; i < picked_events.length; i ) {
picked_events[i] = parse(picked_events[i]);
}
kembali acara_pilihan;
}

// 从数组中随机挑选 saiz 个
function pickRandom(array, size) {
hasil var = [];
untuk (var i = 0; i < array.length; i ) {
  result.push(array[i]);
}
untuk (var j = 0; j < array.length - saiz; j ) {
  var indeks = rawak(iday, j) % result.length;
  result.splice(indeks, 1);
}
pulangkan hasil;
}

// 解析占位符并替换成随机内容
function parse(event) {
var result = {name: event.name, good: event.good, bad: event.bad}; // klon
jika (result.name.indexOf('%v') != -1) {
  result.name = result.name.replace('%v', varNames[random(iday, 12) % varNames.length]);
}
jika (result.name.indexOf('%t') != -1) {
  result.name = result.name.replace('%t', tools[random(iday, 11) % tools.length]);
}
jika (result.name.indexOf('%l') != -1) {
  result.name = result.name.replace('%l', (random(iday, 12) % 247 30).toString());
}
pulangkan hasil;
}

// 添加到“宜”
fungsi addToGood(event) {
$('.good .content ul').append('

' event.name '

' acara .baik '

');
}

// 添加到“不宜”
fungsi addToBad(event) {
$('.bad .content ul').append('

' event.name '

' acara .buruk '

');
}

$(fungsi(){
$('.date').html(getTodayString());
$('.direction_value').html(directions[random(iday, 2) % directions.length]);
$('.drink_value').html(pickRandom(minuman,2).join());
$('.goddes_value').html(rawak(iday, 6) % 50 / 10.0);
pickTodaysLuck();
});

希望本文所述对大家的 jQuery程序设计有所帮助。

jQuery Almanac Lama Kaedah Pelaksanaan Lengkap_jquery