>source

jQuery에서 특정 기능이있는 부트 스트랩 5 모달이 있습니다. 여기에서 내용을로드하기 전에 Modal에서 모달에 나타나기 전에 여기에서 라이브 예제입니다.

예제 링크를 보려고하는 것에 대해 이야기하는 것에 대해 더 많이 알기 위해 콘텐츠를로드하기 전에 모달이 열리면 모달이 나타나는 문제가 발생합니다.

단추를 클릭하는 동안 스피너가 빨리 나타나지 않아서 첫 번째와 둘째로 스피너 내용을 표시하고 올바르지 않습니다.

라이브 예제 : https://codepen.io/themes4all/pen/vymexpy.

jQuery code :

(function ($) {
    "use strict";
    $(window).on("load", function () {
        if ($(".modal").length) {
            $(".modal").modal("show");
            $(".modal").on("shown.bs.modal", function (e) {
                e.preventDefault();
                $(".spinner")
                    .removeClass("d-none")
                    .delay(3000)
                    .fadeOut(500, function () {
                        $(this).addClass("d-none");
                    });
                return false;
            });
            $(".btn-close").on("click", function (e) {
                e.preventDefault();
                var swalWithBootstrapButtons= Swal.mixin({
                    customClass: {
                        confirmButton: "btn btn-primary",
                        cancelButton: "btn btn-danger me-3",
                    },
                    buttonsStyling: false,
                });
                swalWithBootstrapButtons
                    .fire({
                        title: "Are you sure?",
                        text: "You won't be able to revert this!",
                        icon: "warning",
                        confirmButtonText: "<i class='fas fa-check-circle me-1'></i> Yes, I am!",
                        cancelButtonText: "<i class='fas fa-times-circle me-1'></i> No, I'm Not",
                        showCancelButton: true,
                        reverseButtons: true,
                        focusConfirm: false,
                    })
                    .then((result)=> {
                        if (result.isConfirmed) {
                            $(".modal").modal("hide");
                        }
                    });
                return false;
            });
        }
    });
})(window.jQuery);

  • 이전 스파크 구조화 된 스트리밍 맵 실행 프로그램 kafka 주제 파티션의 실행 방법. 동적 할당은 런타임에 매핑을 변경합니까? 그렇다면 어떻게?
  • 다음 JavaScript에서 Fetch를 사용하여 API "ThemeAldb"에서 하나의 식사 조리법을 얻으려면=>오류 404에 액세스 할 수 없습니다.