Bagaimana untuk Mengakses dan Mensiri Data Borang dengan JavaScript/jQuery?

Mengakses Data Borang dengan JavaScript/jQuery

Mendapatkan semula data borang seolah-olah ia telah diserahkan melalui kaedah HTML klasik boleh menjadi tugas biasa dalam pembangunan web. Untuk mencapai matlamat ini, JavaScript/jQuery menyediakan dua pilihan utama:

Pilihan 1: Menggunakan $('form').serializeArray()

Kaedah ini menukar data borang menjadi tatasusunan objek, dengan setiap objek mewakili medan borang. Output adalah dalam format berikut:

[
  {"name":"foo","value":"1"},
  {"name":"bar","value":"xxx"},
  {"name":"this","value":"hi"}
]

Pilihan 2: Menggunakan $('form').serialize()

Kaedah ini mendapatkan semula data borang sebagai rentetan, diformatkan untuk penyerahan melalui POST permintaan:

"foo=1&bar=xxx&this=hi"

Menangkap Elemen Bentuk Kompleks

Tidak seperti medan input mudah, elemen borang seperti kawasan teks, pilihan, butang radio dan kotak semak memerlukan pengendalian khusus. Kedua-dua kaedah yang dinyatakan di atas dengan betul mengendalikan data unsur bentuk kompleks.

Contoh Penggunaan

Kod berikut menunjukkan cara menggunakan kaedah:

// Using serializeArray()
var formDataArray = $('form').serializeArray();

// Using serialize()
var formDataString = $('form').serialize();

Demonstrasi

Rujuk demo JSFiddle ini untuk melihat kaedah dalam tindakan: https://jsfiddle.net/

Atas ialah kandungan terperinci Bagaimana untuk Mengakses dan Mensiri Data Borang dengan JavaScript/jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!