라이브러리

sweetAlert

현재 버전: 11.1.10 https://sweetalert.js.org/

html

<button type="button" onclick="sweetAlert('<strong>테스트입니다.</strong>')">alert</button>
<button type="button" onclick="sweetConfirm('알림입니다.', 'warning', true)">confirm</button>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>

script

// alert
function sweetAlert(msg) {
    swal(msg, {
        buttons: {
            confirm: {
                text  : "확인",
                className: "btn btn-dark"
            }
        },
    });

    $(".swal-text").html(msg);
}

// confirm
// msg: 메시지, type: 유형, cancelFl: 취소 버튼 사용 여부, confirmCallback: 확인 콜백함수, cancelCallback: 취소 콜백함수
function sweetConfirm(msg, type, cancelFl, confirmCallback, cancelCallback){
    swal({
        text: msg,
        icon: type, //success, warning, error, info
        buttons:{
            confirm: {
                text : "확인",
                className: "btn btn-dark"
            },
            cancel: {
                className: "btn btn-default",
                visible: cancelFl, // 취소 버튼 사용 여부
                text : "취소"
            }
        }
    }).then((clicked) => {
        if (clicked) confirmCallback(); // 확인 콜백함수
        else cancelCallback(); // 취소 콜백함수
    });

    $(".swal-text").html(msg);
}