Sweetalert: 두 개의 Sweet Alert 모달을 연속으로 연 후 Tab 키가 작동하지 않음

그 예에서 나는 당신이 말하는 것이 사실이라는 것을 정말로 알 수 없습니다.
'탭'키가 버튼 사이를 이동하기 때문에
두 번째 모달을 받으면 버튼이 하나뿐이므로 탭 버튼을 아무리 많이 눌러도 항상 하나의 버튼이 유지됩니다.

명확하게하지 못해서 죄송합니다!

예, 모델을 탭하고 있지만 두 번째 모달을 닫은 후에는 탭 키를 사용하여 웹 페이지를 탐색 할 수 없습니다 (웹 페이지 만 화면에 모달 없음).

jack126guy / sweetalert @ issue127 에서 수정을 시도했습니다. 포커스가 페이지의 버튼으로 돌아가는 한 작동하는 것 같습니다.

그러나 그것은 또 다른 문제를 보여줍니다. 여전히 다른 버튼으로 이동할 수 없으며 Enter 키를 눌러 경고를 다시 표시하면 상황이 이상해집니다.

예, 비슷한 수정을 시도했지만 SweetAlert가 아닌 웹 사이트의 요소인지 확인하기 위해 창 전역 변수를 사용하여 문서의 요소에 초점을 맞추지 만 Tab 키는 여전히 작동하지 않습니다.

현재이 문제를 해결 한 것으로 보이는 것은 handleKeyDown 메서드의 if (keycode == 9) 절에서 stopEventPropagation (e) 을 제거하는 것입니다. 그러나 나는 이것에 다른 부작용이 있다고 생각합니다 ...

나는 당신에게 커밋을 보여주고 싶지만 다른 사람들이 원하지 않을 수도있는 라이브러리에 대한 다른 변경도했습니다.

따라서 누군가가이 버그에 대한 임시 수정을 원하는 경우이 프로젝트에서 분기 한 저장소가 있습니다. https://github.com/heero-yuy/sweetalert.git

지금까지 모든 프로젝트에서 100 % 작동하지만 변경 사항으로 인해 다른 기능이 손상되지 않았는지 확인하기 위해 광범위하게 테스트하지는 않았습니다.

나는 215 행에서 sweetAlert 또는 swal 함수의 시작 부분에 위의 두 줄의 코드를 삽입하여 수정했습니다. 최선의 해결책인지 모르겠지만 저에게 효과적입니다.

/*
 * Global sweetAlert function
 */
var sweetAlert, swal;

sweetAlert = swal = function() {

    if(previousWindowKeyDown !== undefined && window.onkeydown !== previousWindowKeyDown)`
        window.onkeydown = previousWindowKeyDown;

: +1 :. 이것은 우선 순위를 가져야합니다.

@jayquest 의 수정이

라이브러리를 변경하지 않고 @jayquest로 수정을 구현하기 위해 다음 코드를 사용했습니다.

var previousWindowKeyDown = window.onkeydown;
swal ({
제목 : '확실합니까?',
closeOnConfirm : 거짓,
closeOnCancel : false
}, 함수 (isConfirm) {
window.onkeydown = previousWindowKeyDown;
if (isConfirm) {
swal ( '삭제됨!', '가상 파일이 삭제되었습니다.', '성공');
} else {
swal ( 'Cancelled', '가상 파일은 안전합니다. :)', 'error');
}
});

@amoralidad 의 수정 사항을 확장하려면 프로젝트에 달콤한 경고 라이브러리를 포함시킨 후 한 번만 포함하도록이 옵션을 사용할 수 있으며 swal 서비스를 장식하여 코드와 라이브러리가 방해받지 않도록 유지합니다 (모든 호출에서 위의 수정 사항을 코딩하지 않음). ) 영구적 인 수정이 이루어질 때까지.

(function (){

    var _swal = window.swal;

    window.swal = function(){

        var previousWindowKeyDown = window.onkeydown;

        _swal.apply(this, Array.prototype.slice.call(arguments, 0));

        window.onkeydown = previousWindowKeyDown;

    };

})();

이 버그도 확인할 수 있으며 위의 해결 방법도 잘 작동합니다! : +1 :

네, @JustinWinthers 의 해결 방법이

그러나 대화 상자에서 이스케이프 및 Enter 키를 사용하여 f-up하는 것 같습니다.

@amoralidad 의 해결 방법이 저에게

감사합니다 @jayquest ... @ t4t5 마스터 브랜치에서

내 솔루션과 함께 풀 요청을 제출했습니다. https://github.com/t4t5/sweetalert/pull/547

@JustinWinthers , 코드를 사용하면 type: 'input' . "취소"버튼을 클릭하여 대화 상자를 닫으려고하면 swal.showInputError is not a function 됩니다.

예를 들어, http://clubcare.no/dashboard 로 이동하여 Glemt passord (비밀번호 분실)을 탭합니다.

함수를 제거하면 다시 작동합니다. 이 동작을 제거하는 방법에 대한 아이디어가 있습니까? 감사합니다!

@jayquest 이 문제를

안녕하세요 @JustinWinthers

SweetAlert가 열린 후이 탭 문제를 해결하기위한 제안을 시도했습니다. 문제가 해결되었지만 cancel 버튼을 클릭 할 때 swal.close(); 사용하여 Sweetalert를 닫으려고 할 때이 오류가 발생하기 시작했습니다.

swal.close is not a function

이것은 @EduardJS 가 위에서 말한 것과 유사합니다. 작동하게하는 방법이 있습니까? 너무 가까워진 것 같지만이 오류로 인해 제안 된 코드를 제거해야했습니다. 어떤 도움이라도 좋을 것입니다.

건배,
닐.

라이브러리를 수정하지 않고 찾을 수있는 @JustinWinthers 의 해결 방법을 기반으로하는 가장 간단한 해결책은 swal.close 함수에만 연결하고 window.onkeydown 를 이전 window.onkeydown 이벤트 핸들러 :

(function (){
    var close = window.swal.close;
    var previousWindowKeyDown = window.onkeydown;
    window.swal.close = function() {
        close();
        window.onkeydown = previousWindowKeyDown;
    };
})();

또는 제 경우에는 더 간단합니다.

(function (){
    var close = window.swal.close;
    window.swal.close = function() {
        close();
        window.onkeydown = null;
    };
})();

이 해결 방법으로 대화 상자에서 Enter 및 Escape 키를 사용할 수도 있습니다.

@ Mr-Anonymous 및 @EduardJS에서 언급 한 오류 메시지도 더 이상 발생하지 않습니다.

@kosst 완벽합니다. 공유 해주셔서 감사합니다. 나는 당신의 코드를 시도했고 완벽하게 작동합니다. 정말 고맙습니다!!

건배,
닐.