Sweetalert: 부트스트랩 모달 위에 사용될 때 입력 필드가 작동하지 않음

나는 같은 문제가 있었다. 내가 한 일은 modal.hide로 모달을 '숨기기', swal을 열고 inputValue로 필요한 모든 작업을 수행한 다음 swal이 성공하거나 취소될 때 modal.show로 모달을 표시하는 것입니다.
도움이 되었기를 바랍니다.

단
이에 대한 해결책을 찾았습니다. 내일 포스팅할게요

Outlook에서 보낸

2015년 8월 10일 월요일 오전 6시 52분 -0700시에 "Dan Kaufman" [email protected]이 작성했습니다.

나는 같은 문제가 있었다. 내가 한 일은 modal.hide로 모달을 '숨기기', swal을 열고 inputValue로 필요한 모든 작업을 수행한 다음 swal이 성공하거나 취소될 때 modal.show로 모달을 표시하는 것입니다.

도움이 되었기를 바랍니다.

—
이 이메일에 직접 회신하거나 GitHub에서 확인하세요.

안녕하세요 mteichtahl님,

여전히 수정 사항을 게시 했습니까? 못 찾겠 어. 정말 도움이 될 것입니다!

안녕,

sweetalert2뿐만 아니라 sweetalert에서도 같은 문제가 발생합니다.
입력 필드는 파이어폭스에만 초점을 맞추지 않습니다. 이것은 부트스트랩 모달에서 swal을 열 때만 발생합니다.

아직 문제를 파악할 수 없습니다. 정말 이상하다.

같은 문제가 있습니다 ... 누구에게 해결책이 있습니까?

안녕하세요, 이것은 입력 자리 표시자를 표시할 수 있지만 입력에 초점을 맞추도록 수정되지 않았습니다...

#537

같은 문제가 있습니다. 수정 사항을 찾을 수 없습니다...

+1

나는 범인이 Bootstrap의 모달에 설정된 tabindex="-1" 임을 발견했습니다.

수정:

// call this before showing SweetAlert:
function fixBootstrapModal() {
  var modalNode = document.querySelector('.modal[tabindex="-1"]');
  if (!modalNode) return;

  modalNode.removeAttribute('tabindex');
  modalNode.classList.add('js-swal-fixed');
}

// call this before hiding SweetAlert (inside done callback):
function restoreBootstrapModal() {
  var modalNode = document.querySelector('.modal.js-swal-fixed');
  if (!modalNode) return;

  modalNode.setAttribute('tabindex', '-1');
  modalNode.classList.remove('js-swal-fixed');
}

모달이 너무 높아서 y축에서 스크롤할 수 있는 경우에만 발생한다는 점을 제외하면 거의 동일한 문제가 있습니다.

도와주세요...

Cinamonas의 탭 수정이 저에게 효과가 없었습니다 :(

+1
@eminumut @navas
swal을 표시하기 전에 fixBootstrapModal()을 호출했습니까? 처음에는 잊어버렸지만 지금은 완벽하게 작동합니다!

@Cinamonas 감사합니다

@알라게시아93

몇 가지 예를 보여 주시겠습니까?

@에미누트

fixBootstrapModal()
swal({whatever}, function(isConfirm){
whatever
restoreBootstrapModal()
}

그것은 나를 위해 작동합니다 :)

수정 사항은 IE11에서 구문 오류를 생성합니다.

@caleb87 , 화살표 기능과 const 를 사용하지 않도록 스니펫을 업데이트했습니다.

이것은 Bootstrap의 문제인 것 같으므로 일단 닫겠습니다. @Cinamonas 수정 감사합니다!

안녕하세요, 저도 같은 문제에 직면했습니다.
이 문제는 Bootstrap Modal에서 { tabindex="-1" }을 제거하여 해결할 수 있습니다.
그것은 나를 위해 잘 작동합니다.

R에서 이 수정 사항을 적용하는 방법을 아는 사람이 있습니까? 나는 같은 문제가 있지만 R로 변환하려는 시도는 지금까지 실패했습니다.

나는 범인이 Bootstrap의 모달에 설정된 tabindex="-1" 임을 발견했습니다.

수정:

// call this before showing SweetAlert:
function fixBootstrapModal() {
  var modalNode = document.querySelector('.modal[tabindex="-1"]');
  if (!modalNode) return;

  modalNode.removeAttribute('tabindex');
  modalNode.classList.add('js-swal-fixed');
}

// call this before hiding SweetAlert (inside done callback):
function restoreBootstrapModal() {
  var modalNode = document.querySelector('.modal.js-swal-fixed');
  if (!modalNode) return;

  modalNode.setAttribute('tabindex', '-1');
  modalNode.classList.remove('js-swal-fixed');
}

천재

둘 이상의 모달이 있는 경우 다음을 사용할 수 있습니다.
문서 문서 (1).pdf