ハイパーリンクをクリックしたときにデータをブートストラップ モーダルに渡すにはどうすればよいですか?

ブートストラップ モーダルにデータを渡す

当面のタスクには、ハイパーリンクをクリックしてブートストラップ モーダルを開き、関連付けられた ID をモーダル。試みにもかかわらず、ユーザーはモーダルが非アクティブなままであるか、必要なデータが欠落しているという問題に遭遇します。

解決策

jQuery フレームワークの .on イベント ハンドラーを活用することが効果的であることが証明されています。方法。次のアプローチを検討してください。

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"

});

このアプローチでは、ハイパーリンクをクリックします。モーダルを開き、リンクから取得した ID を入力フィールドに入力します。このソリューションは、ハイパーリンクをクリックしたときにデータをブートストラップ モーダルに渡す問題に効果的に対処します。

以上がハイパーリンクをクリックしたときにデータをブートストラップ モーダルに渡すにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。