Rumah > hujung hadapan web > tutorial js > Gunakan jQuery.wechat untuk membina WeChat WEB application_jquery

Gunakan jQuery.wechat untuk membina WeChat WEB application_jquery

WBOY
Lepaskan: 2016-05-16 16:34:32
asal
1558 orang telah melayarinya

Oleh kerana baru-baru ini produk saya perlu dipromosikan dalam akaun awam WeChat dan perlu menyediakan beberapa fungsi yang bermakna, jadi saya terpaksa memulakan jalan tanpa pulangan dengan menyokong WeChat.

Seperti yang kita semua tahu, Tencent adalah sebuah syarikat yang ajaib dokumen rasmi mengenai pembangunan web hanyalah contoh individu, dan selebihnya... Haha, ada sesuatu yang dipanggil Pertukaran Pembangun dan Bantuan Bersama.

Selepas membaca gambar di atas, adakah anda mempunyai perasaan bahawa sekumpulan orang sedang berusaha keras untuk mengetahui apa yang berlaku, tetapi tiada kenyataan rasmi! o(∩_∩)o Haha

Setelah berkata begitu banyak, mari cepat sampai ke perkara yang ingin saya bincangkan dalam isu ini ialah jQuery.wechat, yang saya tulis selepas bergelut dalam kesakitan, jQuery.plugin berdasarkan jQuery.promise yang menyediakan satu kesatuan. API. Harap ini membantu semua orang.

Pertama sekali, ia agak mudah untuk dipasang

Salin kod Kod adalah seperti berikut:

pemasangan bower --save jquery-wechat

Jika anda tidak menggunakan bower dan muat turun dan nyahzip sendiri daripada Github, ia adalah perkara yang sama!

Memuatkan, ia semulajadi seperti air

Salin kod Kod adalah seperti berikut:



Jika anda menggunakan teknologi pemuatan malas seperti amd dan cmd, anda mesti pakar Anda tidak perlu saya mengajar anda cara mengkonfigurasinya, bukan?

Gunakan - mudah, mudah, bersatu dan menyeronokkan!

Dayakan fungsi jQuery.wechat
$.wechat.enable(); //Sangat mudah!

Oleh kerana keseluruhan pemalam adalah berdasarkan jQuery.promise, anda juga boleh memberikannya rangkaian:

Salin kod Kod adalah seperti berikut:

$.wechat.enable().done(function(){
alert('berjaya diaktifkan');
}).gagal(fungsi(){
alert('Pengaktifan gagal');
});

Memandangkan aplikasi luas semasa teknologi halaman tunggal (SPA), reka bentuk kelas alat mesti mempertimbangkan mekanisme dayakan/lumpuhkan, jika tidak, ralat yang tidak diketahui mungkin berlaku.

Sembunyikan/tunjukkan menu

Salin kod Kod adalah seperti berikut:

$.wechat.hideMenu(); //Sembunyikan menu
$.wechat.showMenu(); //Tunjukkan menu

Selepas mendayakan jQuery.wechat, anda boleh memanggil kaedah seperti hideMenu sesuka hati tanpa menulis kaedah lain ke dalam panggilan balik yang telah didayakan. Prinsip pelaksanaan jQuery.wechat ialah jika jQuery.wechat tidak berjaya didayakan, semua operasi akan beratur Setelah berjaya didayakan, ia akan dilaksanakan secara berurutan jika pembolehan gagal, ia tidak akan dilaksanakan.

Sembunyikan/tunjukkan bar alat bawah
$.wechat.hideToolbar(); //Sembunyikan bar alat bawah
$.wechat.showToolbar(); //Tunjukkan bar alat bawah

Buka antara muka pengimbasan kod QR
$.wechat.scanQRcode();

Buka alat pratonton imej

Salin kod Kod adalah seperti berikut:

$.wechat.preview({
Semasa: 'http://xxx/img/pic001.jpg', //Selepas memasuki mod pratonton, paparkan gambar ini terus
url: [
         'http://xxx/img/pic001.jpg',
         'http://xxx/img/pic002.jpg',
         'http://xxx/img/pic003.jpg',
          'http://xxx/img/pic004.jpg',
         'http://xxx/img/pic005.jpg',
         'http://xxx/img/pic006.jpg'
] ]                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 });

Dapatkan status rangkaian


Salin kod Kod adalah seperti berikut:
$.wechat.getNetworkType().done(function(respons) {
$('#network').text(response.split(':')[1]);
});

Format respons adalah seperti berikut:


Salin kod Kod adalah seperti berikut:
network_type:rangkaian wifi wifi
network_type:edge Bukan wifi, termasuk 3G/2G
network_type:fail Pemutusan rangkaian
network_type:wwan (2g atau 3g)

Ubah suai format perkongsian

Setiap kali saya melihat mesej yang dikongsi oleh apl orang lain, ia disertakan dengan lakaran kecil yang cantik, tajuk dan huraian yang sesuai Lebih-lebih lagi, terdapat baris teks kecil di bawah mesej yang menunjukkan siapa yang menghantar mesej itu mesej yang anda kongsi, gambar kosong lalai berwarna biru dengan tajuk yang tidak sepadan Adakah anda tertanya-tanya apakah logiknya?

Nasib baik, mari selesaikan masalah ini sekarang:


Salin kod Kod adalah seperti berikut:
$.wechat.setShareOption({
appid: 'xxxx',                                                    img_width: '60',
img_height: '60',
img_url: window.location.toString() 'img/demo.jpg', //Thumbnail
tajuk: 'DEMO', //Tajuk
Perihalan: 'Penerangan ditetapkan daripada $.wechat.setShareOption', //Penerangan
Pautan: function() {
Kembalikan window.location.toString(); //Selepas mesej dikongsi, pengguna mengklik alamat pautan yang dibuka oleh mesej
},
​ panggil balik: function(respons) {
alert(respons); //Fungsi panggil balik selepas perkongsian, yang biasa adalah kejayaan dan pembatalan
}
});

Einzelheiten entnehmen Sie bitte den folgenden Screenshots:


Diese Änderung des Freigabeformats wirkt sich auf die vier Funktionen Senden an Freunde, Teilen auf Moments, Teilen auf Weibo und Senden von E-Mails aus. Klicken Sie nach der Einstellung auf die Menüschaltfläche in der oberen rechten Ecke, um das Menü zu öffnen, wählen Sie eines der oben genannten vier Elemente aus und Sie sehen den geänderten Effekt

Aktuelle Seite schließen

Code kopieren Der Code lautet wie folgt:

$.wechat.closeWindow();

jQuery.wechat-Mechanismus deaktivieren

Code kopieren Der Code lautet wie folgt:

$.wechat.destroy();

Nach der Deaktivierung werden alle Funktionen automatisch auf den Ausgangszustand zurückgesetzt
Diese Funktion wird häufig in Single-Page-Anwendungen (SPA)

verwendet
Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan