jQuery menggunakan nod kawalan untuk melengkapkan pemindahan parameter hanya di latar depan melalui get method_jquery

Contoh dalam artikel ini menerangkan cara jQuery menggunakan nod kawalan untuk melengkapkan pemindahan parameter hanya di latar depan melalui kaedah get. Kongsikan dengan semua orang untuk rujukan anda. Analisis khusus adalah seperti berikut:

Ini juga merupakan kandungan DOM HTML Inti bahasa skrip bahagian hadapan​​seperti javascript dan jquery adalah untuk mengawal setiap nod dan menambah, memadam, mengubah suai dan menyemak setiap nod Hanya dengan cara ini bolehkah kita benar-benar menggunakan skrip front-end seperti javascript dan jquery menghasilkan satu demi satu perkara yang cantik.

Nod kawalan JavaScript, pengarang telah memperkenalkannya dalam [contoh penggunaan JavaScript untuk menambah, memadam, mengubah suai dan menyemak nod halaman web] sebelum ini, kini ia dikawal melalui jquery, bahasa skrip javascript lanjutan . nod, dan atas dasar ini, jquery digunakan untuk memindahkan parameter antara halaman web yang berbeza Pemindahan parameter hanya diselesaikan melalui kaedah get di latar depan, dan ia tidak perlu untuk jsp dan asp. Tulis beberapa permintaan dan bahasa pelayan lain untuk mendapatkan parameter.

1. Matlamat asas

Dalam halaman web, terdapat nod rentang di bawah p div-merah div-biru hitam Setelah diklik, id nod di atasnya masing-masing diperoleh

Klik butang Tambah untuk menambah nod hiperpautan Setiap hiperpautan mempunyai parameter Cina Hello 1, Hello 2, Hello 3..., dan bar skrol secara automatik menatal dengan peningkatan nod, ke arah jqrec HTML parameter, halaman jqrec.html boleh mendapatkan parameter Cina ini

Klik butang kosong untuk mengosongkan semua nod di bawah ul

2. Proses pengeluaran

Kod penuh jqrec.html adalah seperti berikut Fungsi yang digunakan melibatkan ungkapan biasa untuk menganalisis alamat URL, jadi tidak perlu pergi ke butiran. Satu-satunya kod yang benar-benar berfungsi ialah, $("#rec").text(unescape(getUrlParam("text")));

Salin kod Kod adalah seperti berikut:

Pautan yang anda klik ialah:, yang dilalui melalui kaedah get pada penyemak imbas Parameter teks adalah sama persis ~

Parameter yang dihantar pada teks adalah dalam bahasa Cina, dan hasilnya perlu dinyahkod~

Kembali ke jqsend.html dan cuba lagi~

/*Fungsi ini, bersama-sama dengan fungsi unescape, boleh menyahkod elemen utf-8 yang diluluskan oleh kaedah get pada url*/
fungsi getUrlParam(nama)
{
var reg = new RegExp("(^|&)" nama "=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if (r!=null) return unescape(r[2]); return null; }
$(function() {
$("#rec").text(unescape(getUrlParam("text")));
});



Kod penuh jqsend.html adalah seperti berikut. Sila lihat komen untuk kod khusus:




Salin kod


Kod adalah seperti berikut:

 
 
 
 
 
 
 
 
 
 
 

 

 

 
 
我的父节点 
 

 

 

Tambah Clear

/*$(function(){}); Bersamaan dengan fungsi $(document).ready(function (){}); $(function() {
/*Count id*/
var id=0; /*acara klik butang tambah*/
$("#add").klik(fungsi (){
               id=id 1;                                                           var li="

"; /*Dalam senarai testu, tambah nod li seperti yang dinyatakan di atas*/
               $("#testul").append(li); /*Cari nod di bawah nod li yang baru ditambah dengan ID idx (di mana x ialah nilai counter var id), dan ubah suai elemen di dalamnya kepada hello x .html dalam jquery adalah bersamaan dengan innerHTML dalam javascript* /
                $("#id" id.toString()).find("a").html("Hello" id); /*Tetapkan atribut href elemen ini kepada id jqrec.html="Hello" Memandangkan aksara Cina tidak boleh disertakan dalam pautan, gunakan escape dua kali untuk mengekodnya ke dalam pengekodan utf-8. Jika anda menggunakannya sekali, pepijat akan muncul. Tidak dapat memperoleh unescape, saya tidak tahu mengapa*/
$("#id" id.toString()).find("a").attr("href","./jqrec.html?text=" escape("Hello" id))); >                          /*Tetapkan bar skrol untuk menatal dengan ketinggian testul Kod ini tidak sah di bawah iaitu8*/
                $("body").scrollTop($("#testul").height());
           }); 
/*acara klik butang kosong*/
$("#clear").klik(fungsi (){
                       /* Kosongkan semua elemen di bawah testul dan kosongkan pembilang kepada sifar*/                                                                         $("#testul").kosong();                 id=0;                                               }); 
/*acara klik teks dalam baris findmyfather*/
$("#findmyfather").klik(function(){
               /*Ini mewakili findmyfather yang ditekan, ambil id nod induk peringkat atasnya*/
Thisid=$(this).parents().attr("id");
alert("Nod induk saya ialah: " thisid);                /*Dengan cara ini anda boleh berharap untuk mencari id elemen div pertama*/ 
Thisid=$(this).parents("div").attr("id");
alert("Nod induk div pertama saya ialah: " thisid);                /*Dengan cara ini anda boleh berharap untuk mencari id elemen div kedua*/ 
Thisid=$(this).parents("div").parents("div").attr("id"); alert("Nod induk div kedua saya ialah: " thisid);           });                                                      });



Saya harap artikel ini akan membantu pengaturcaraan jQuery semua orang.