jquery suka dan tidak suka plugin

Dengan peningkatan media sosial, suka telah menjadi salah satu fenomena budaya penting dalam budaya dalam talian hari ini dan alat yang diperlukan untuk orang ramai dalam proses ekspresi dan komunikasi. Sama ada di Weibo, Instagram atau Facebook, suka ialah cara yang mudah dan berkesan untuk menyatakan pilihan, emosi dan sikap anda. Dalam konteks ini, pemalam jQuery suka dan tidak seperti pemalam telah menjadi salah satu alat penting untuk pembangun. Pemalam ini membolehkan pembangun melaksanakan suka dan tidak suka pada halaman dengan cara yang mudah dan berskala.

1. Pengenalan pemalam

Pemalam suka dan tidak suka jQuery ini dibangunkan secara bebas oleh pembangun domestik dan menyepadukan ciri utama berikut:

1. Kelajuan: pemalam Kod ini ringkas dan cekap, tanpa mengurangkan prestasi dan kelajuan halaman.
2. Mudah: Pemalam mudah digunakan, cuma masukkan fail kod pemalam dan gunakan pemilih jQuery untuk memilih elemen yang perlu suka dan tidak suka fungsi.
3. Skalabiliti: Pemalam menyokong konfigurasi tersuai dan boleh dikembangkan dan diubah suai mengikut keperluan sebenar.
4. Keserasian: Pemalam menyokong penyemak imbas arus perdana dan menyokong jQuery untuk berfungsi dalam berbilang versi.

2. Penggunaan pemalam

Untuk menggunakan pemalam suka dan tidak suka jQuery ini, anda hanya perlu merujuk dua fail dalam halaman HTML anda, satu ialah jQuery (versi Mesti berada dalam 1.9 atau lebih tinggi), yang satu lagi ialah fail kod pemalam. Anda boleh memuat turun fail pemalam daripada platform pengehosan kod domestik utama (seperti GitHub atau Gitee) dan memasukkannya ke dalam halaman anda seperti ini:

<script src="js/jquery.min.js"></script>
<script src="js/jquery.like-dislike.js"></script>

Selepas itu, anda perlu menentukan titik pelaksanaan dalam Halaman HTML Elemen dengan fungsi suka dan tidak serupa, yang boleh dicapai melalui pemilih jQuery. Sebagai contoh, anda boleh memilih butang untuk suka dan tidak suka:

<button class="like-button">点赞</button>

Tahniah, anda telah melengkapkan bahagian penggunaan pemalam, sekarang mari lihat cara menukar butang mudah ini kepada fungsi Digunakan untuk suka dan tidak suka.

3. Laksanakan suka dan tidak suka

Sekarang kami telah mengimport pemalam ke dalam halaman HTML kami, kami perlu menggunakan jQuery untuk melaksanakan fungsi suka dan tidak suka. Sama seperti mengimport kod pemalam, kita juga perlu menulis kod jQuery yang ringkas untuk melaksanakan fungsi ini Berikut ialah kod untuk melaksanakan suka dan tidak suka:

$(function(){
    $('.like-button').likeDislike({
        reverseMode: true, // 是否启用反转模式
        click: function(like, dislike, event) {
            var value = $(this).attr('value');
            if (value == 'like') {
                var new_value = 'dislike';
            } else {
                var new_value = 'like';
            }
            $(this).attr('value', new_value);
        }
    });
});

Coretan kod jQuery ini sangat mudah dan melaksanakan togol. butang Atribut nilai digunakan untuk melaksanakan fungsi penukaran suka dan membatalkan suka. Adalah penting untuk ambil perhatian bahawa kami menggunakan kelas .like-button apabila memilih butang, yang kami takrifkan dalam penanda HTML di atas. Jika anda memilih kelas atau ID yang berbeza, anda perlu mengubah suainya dengan sewajarnya untuk memastikan kod jQuery anda boleh mencari elemen yang anda pilih.

4. Konfigurasi pemalam

Pemalam seperti dan tidak seperti jQuery ini juga membolehkan anda melakukan beberapa konfigurasi tersuai. Sebagai contoh, anda boleh melaraskan teks butang, kelewatan masa dan juga menentukan kategori CSS untuk dapat menyesuaikan penampilan dan gaya butang. Berikut ialah pilihan yang tersedia untuk konfigurasi:

1. reverseMode (jenis bool): Nilai lalai adalah palsu, jika ditetapkan kepada benar, pemalam akan membalikkan nilai (menggantikan nilai asal ditukar kepada nilainya nilai bertentangan).
2. dilumpuhkan (jenis bool): Nilai lalai adalah palsu. Jika ditetapkan kepada benar, butang suka dan tidak suka akan dilumpuhkan.
3. kelewatan (jenis int): Nilai lalai ialah 500, menunjukkan kelewatan masa animasi.
4. klik (jenis fungsi): Lalai adalah batal, tetapkan pengendali acara klik.
5. likeClass (jenis rentetan): Tetapkan kategori CSS butang suka.
6. dislikeClass (jenis rentetan): Tetapkan kategori CSS bagi butang batal suka.
7. likeText (jenis rentetan): Tetapkan teks butang suka.
8. dislikeText (jenis rentetan): Tetapkan teks butang batal suka.

Di atas ialah pilihan boleh dikonfigurasikan untuk pemalam dan boleh diubah suai serta dikembangkan mengikut keperluan.

5. Ringkasan

Artikel ini memperkenalkan pemalam seperti jQuery dan tidak seperti pemalam ini membolehkan pembangun menambahkan cara yang cepat dan mudah ke tapak web atau aplikasi untuk mencapai suka dan membatalkan fungsi seperti. Pemalam ini menggunakan pemilih jQuery untuk mencari elemen pada halaman dan melakukan tindakan suka dan tidak suka pada elemen tersebut. Di samping itu, pemalam ini juga menyokong pilihan konfigurasi yang boleh diperluaskan yang boleh diubah suai dan dilanjutkan mengikut keperluan pembangun. Pemalam yang ringkas dan praktikal ini akan meningkatkan lagi pengalaman pengguna, meningkatkan interaktiviti dan menjadikan tapak web dan aplikasi anda lebih menarik.

Atas ialah kandungan terperinci jquery suka dan tidak suka plugin. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!