Bootstrap 5 モーダルとその上に配置されたポップアップに問題があります。
私の HTML には次のものがあります。ユーザーがボタンの上にマウスを置くと、正しく表示されます。ポップアップには「よろしいですか?」という入力プロンプトが表示され、ボタン (ホバー) をクリックして続行するようユーザーにアドバイスされます。ボタンをクリックするとフォーカスが移動し、再度クリックするか要素をクリックして離れるまでポップアップが開いたままになります。
これにより、マウス ポインタがポップアップ ウィンドウのコンテンツに入り、[続行] ボタンをクリックできるようになります。
これが私が望むものです: https://bootstrap-confirmation.js.org ですが、ボタン ホバーに表示される機能についての詳細が含まれています...
とにかく、とてもうまくいきます!初めて...モーダルが非表示になってから再び表示された場合、ポップアップトリガーのホバー部分のみが機能し、ボタンをクリックするとリスナーが起動されますが、ポップアップは開いたままにすることを拒否します(「フォーカス」トリガーによる) ..
助けてください、これは私をおかしくさせます!
残念なことに、以下のコード スニペットは機能しているように見えますが、モーダルを閉じて再度開くとエラーがスローされます。理由はわかりません。
追加するために編集: この問題は Chrome と Safari の両方に存在します。Safari ではコンソール エラーが作成されます:
リーリーlocate_dev.js 394 行目のコードはポップアップ ウィンドウの初期化であり、疑わしいです:
リーリーリーリー リーリー
モーダルが非表示になってから再表示されるまでの間のある時点でポップアップの内容が消えるため、エラーが発生するようです。
###考慮する:### リーリーテスト
$('[data-name="close-btn-popover-content"]') コンテンツをまったく返しません。モーダルを初期化するとき(ポップアップを初期化する前)に親 div に手動でアタッチしても役に立ちません。
解決しました!
ボタン HTML から
data-bs-trigger="hover focus"
属性を削除し、次のように使用しました。 リーリー'hidden.bs.modal'
コンテンツで
$('[data-name="close-btn-popover-content"]')を再構築する必要もあります。以下に示すように:
リーリー