내 Bootstrap 5 팝업이 원래 있던 모달을 닫았다가 다시 연 후 포커스를 여는 기능을 잃는 이유는 무엇입니까?

Question

내 Bootstrap 5 모달과 그 위에 배치된 팝업에 문제가 있습니다.

내 HTML에는 다음이 있으며 사용자가 버튼 위로 마우스를 가져가면 올바르게 표시됩니다. 팝업에는 "정말입니까?"라는 메시지가 표시되고 사용자에게 계속하려면 버튼(호버)을 클릭하라는 메시지가 표시됩니다. 버튼을 클릭하면 포커스가 설정되고 다시 클릭하거나 요소에서 멀리 클릭할 때까지 팝업이 열린 상태로 유지됩니다.

이렇게 하면 마우스 포인터가 팝업 내용에 들어가고 "계속" 버튼을 클릭할 수 있습니다.

제가 원하는 것은 https://bootstrap-confirmation.js.org입니다. 하지만 마우스 오버 시 표시되는 버튼의 기능에 대한 자세한 내용은...

어쨌든 잘 작동합니다! 처음으로...모달이 숨겨졌다가 다시 표시되면 팝업 트리거의 호버 부분만 작동하고 버튼을 클릭하면 리스너가 실행되지만 팝업은 열려 있는 상태를 거부합니다(""포커스" 트리거에 따라). )..

도와주세요. 이게 나를 미치게 만들고 있어요!

실망스럽게도 아래 코드 조각은 작동하는 것 같습니다. 비록 모달을 닫았다가 다시 열 때 오류가 발생하지만 이유는 잘 모르겠습니다.

추가하도록 편집됨: 이 문제는 Chrome과 Safari 모두에 존재하며 Safari에서는 콘솔 오류가 발생합니다.

으아악

locate_dev.js 394행의 코드는 팝업 창 초기화입니다. 의심스럽습니다.

으아악

으아악 으아악

모달이 숨겨졌다가 다시 표시되는 사이 어느 시점에서 팝업 내용이 사라지기 때문에 오류가 발생하는 것 같습니다.

고려 사항:

으아악

Test $('[data-name="close-btn-popover-content"]') 아무것도 반환하지 않습니다. 모달을 초기화할 때(팝업을 초기화하기 전에) 상위 div에 수동으로 연결하는 것도 도움이 되지 않습니다.

Answer 1

해결되었습니다!

버튼 HTML에서 data-bs-trigger="hover focus" 속성을 제거하고 다음을 사용했습니다.

으아아아

다음과 같이 'hidden.bs.modal' 上重建 $('[data-name="close-btn-popover-content"]')의 콘텐츠도 필요합니다.

으아아아