Rumah >hujung hadapan web >tutorial js >Bagaimana untuk Menghantar Data ke Modal Bootstrap Apabila Mengklik Hiperpautan?

Bagaimana untuk Menghantar Data ke Modal Bootstrap Apabila Mengklik Hiperpautan?

Susan Sarandon
Susan Sarandonasal
2024-12-26 02:55:13331semak imbas

How to Pass Data to a Bootstrap Modal When Clicking a Hyperlink?

Mengirim Data ke Modal Bootstrap

Tugas yang sedang dijalankan melibatkan membuka modal Bootstrap apabila mengklik hiperpautan dan menghantar ID yang berkaitan ke modal. Walaupun terdapat percubaan, pengguna menghadapi masalah di mana mod kekal tidak aktif atau kekurangan data yang diperlukan.

Penyelesaian

Memanfaatkan pengendali acara .on rangka kerja jQuery terbukti berkesan kaedah. Pertimbangkan pendekatan berikut:

HTML

<a data-toggle="modal" data-id="ISBN564541" title="Add this item">

JavaScript

$(document).on("click", ".open-AddBookDialog", function () {
    var myBookId = $(this).data('id'); // Retrieve the ISBN from the clicked link
    $(".modal-body #bookId").val(myBookId); // Set the input field's value in the modal
    // It is unnecessary to manually call the modal as Bootstrap handles it with data-toggle="modal"

});

Dengan pendekatan ini, mengklik hiperpautan kedua-duanya akan membuka modal dan mengisi medan input dengan ID yang diambil daripada pautan. Penyelesaian ini berkesan menangani isu penghantaran data ke modal Bootstrap apabila mengklik hiperpautan.

Atas ialah kandungan terperinci Bagaimana untuk Menghantar Data ke Modal Bootstrap Apabila Mengklik Hiperpautan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn