


Bagaimana untuk Menghantar Dua Borang HTML Serentak dengan Satu Butang?
Dec 02, 2024 am 05:58 AMCara Menghantar Dua Borang dengan Satu Butang
Dalam dokumen HTML, adalah mungkin untuk mempunyai berbilang borang dengan tindakan yang berbeza. Walau bagaimanapun, menyerahkan kedua-duanya secara individu boleh menyusahkan pengguna. Artikel ini meneroka penyelesaian kepada dilema ini dengan menggunakan JavaScript untuk menyerahkan kedua-dua borang secara serentak.
Borang Pertama: Menyerahkan Data ke Pangkalan Data
Borang pertama, updateDB, bertanggungjawab untuk menghantar data ke pangkalan data menggunakan PHP. Berikut ialah contoh kod HTML:
<form>
Borang Kedua: Mengubah hala ke Halaman Pembayaran PayPal
Borang kedua, payPal, mengarahkan pengguna ke halaman pembayaran selepas penyerahan.
<form>
Menggunakan JavaScript untuk Menghantar Kedua-dua Borang
Untuk menyerahkan kedua-dua borang secara serentak, ikuti ini langkah:
- Buat fungsi JavaScript untuk mengendalikan acara serahan.
- Dalam fungsi tersebut, gunakan XMLHttpRequest atau fetch() untuk menyerahkan borang updateDB secara tidak segerak.
- Selepas borang updateDB berjaya diserahkan, serahkan payPal borang.
function submitBothForms() { // Submit updateDB form asynchronously via XMLHttpRequest var xhr = new XMLHttpRequest(); xhr.open("POST", "mypage.php", true); xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xhr.send(postData.join("&")); // Submit payPal form document.getElementById("payPal").submit(); }
Kod Kemas Kini dengan Fetch()
async function submitBothForms() { // Submit updateDB form asynchronously via fetch() const res = await fetch("mypage.php", { method: "POST", headers: { "content-type": "application/x-www-form-urlencoded" }, body: new FormData(updateDB), }); if (!res.ok) throw new Error("DB Update Failed!"); // Submit payPal form payPal.submit(); }
Kesimpulan
Dengan memanfaatkan JavaScript, adalah wajar untuk menyerahkan dua borang dengan satu butang. Pendekatan ini memberikan pengalaman yang lancar untuk pengguna, mengelakkan keperluan untuk berbilang penyerahan. Ingat untuk menyesuaikan pengendalian ralat dan pemesejan berdasarkan keperluan khusus anda.
Atas ialah kandungan terperinci Bagaimana untuk Menghantar Dua Borang HTML Serentak dengan Satu Butang?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Artikel Panas

Alat panas Tag

Artikel Panas

Tag artikel panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

Ganti aksara rentetan dalam javascript

jQuery mendapatkan padding/margin elemen

HTTP Debugging dengan Node dan HTTP-Console

Tutorial Persediaan API Carian Google Custom
