jquery bagaimana untuk hyperlink

jQuery ialah perpustakaan Javascript yang digunakan secara meluas yang boleh mencapai kesan interaktif dinamik dengan mudah. Antaranya, hiperpautan juga merupakan kesan interaktif yang biasa. Artikel ini akan memperkenalkan cara melaksanakan hiperpautan jQuery.

1. Hiperpautan asas

Hiperpautan ialah salah satu elemen yang biasa digunakan dalam HTML dan digunakan untuk melompat antara halaman yang berbeza. Dalam HTML, kod asas hiperpautan adalah seperti berikut:

<a href="link地址">链接文本</a>

"alamat pautan" di sini ialah halaman pautan untuk dilawati, yang boleh menjadi halaman web lain, gambar, video, dsb.; teks pautan" ialah hiperpautan Teks paparan pautan. Hiperpautan asas ini juga boleh dikendalikan menggunakan jQuery.

$(document).ready(function(){
  $("a").click(function(){
    alert("链接已被点击");
  });
});

Dalam kod ini, $(document).ready() ialah sintaks yang biasa digunakan dalam rangka kerja jQuery, menunjukkan bahawa ia akan dilaksanakan selepas dokumen dimuatkan. $("a") bermaksud memilih semua hiperpautan. .click() bermaksud untuk melaksanakan kod yang sepadan apabila hiperpautan diklik Kod di sini hanya muncul kotak gesaan.

2. Cegah lompat lalai

Dalam aplikasi praktikal, kadangkala perlu memproses hiperpautan sebelum melompat. Walau bagaimanapun, jika tiada pemprosesan dilakukan, setelah hiperpautan diklik, halaman akan melompat terus ke alamat pautan yang ditentukan. Untuk mengelakkan tingkah laku lompat lalai ini, anda boleh menggunakan kod berikut:

$(document).ready(function(){
  $("a").click(function(event){
    event.preventDefault();
    alert("链接已被点击");
  });
});

Dalam kod ini, parameter acara dilampirkan untuk menerima objek acara. .preventDefault() menghalang tingkah laku lompat lalai. Dengan cara ini, apabila hiperpautan diklik, ia tidak akan melompat terus, tetapi akan melaksanakan fungsi yang sepadan dalam kod.

3. Laksanakan lompatan

Selepas memproses hiperpautan, anda perlu melaksanakan fungsi lompat. Terdapat dua cara untuk melaksanakan lompatan. Salah satunya ialah menggunakan sifat .window.location untuk mengubah hala URL halaman semasa ke alamat pautan yang ditentukan.

$(document).ready(function(){
  $("a").click(function(event){
    event.preventDefault();
    var linkLocation = this.href;
    window.location = linkLocation;
  });
});

Dalam kod ini, atribut this.href digunakan untuk mendapatkan URL untuk diubah hala, dan kemudian atribut window.location digunakan untuk mengubah hala ke URL.

Lainnya ialah menggunakan atribut .location.href, yang pada asasnya sama dengan .window.location.

$(document).ready(function(){
  $("a").click(function(event){
    event.preventDefault();
    var linkLocation = this.href;
    location.href = linkLocation;
  });
});

Gunakan kedua-dua kaedah ini untuk mencapai fungsi lompat hiperpautan.

Ringkasan

Apabila menggunakan jQuery untuk memproses hiperpautan, anda perlu memberi perhatian untuk menghalang tingkah laku lompat lalai dan melaksanakan fungsi lompat. Anda boleh menggunakan sifat window.location atau location.href untuk melaksanakan lompatan. Pada masa yang sama, untuk sebilangan besar operasi hiperpautan, adalah disyorkan untuk menggunakan pemalam jQuery khusus rangka kerja, seperti jQueryUI yang disediakan secara rasmi atau rangka kerja Bootstrap yang biasa digunakan.

Atas ialah kandungan terperinci jquery bagaimana untuk hyperlink. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!