Синтаксис Sweet Alert

Мне не удается получить сладкое предупреждение, и я думаю, что это как-то связано с синтаксисом. Может ли кто-нибудь показать мне, что я должен делать

<!DOCTYPE html>
<html>
 <head>
  <title>Testing</title>
  <script src="dist/sweetalert.min.js"></script>
  <link rel="stylesheet" type="text/css" href="dist/sweetalert.css">
 </head>
<body>
<script>
   swal({
     title: 'Confirm',
     text: 'Are you sure to delete this message?',
     type: 'warning',
     showCancelButton: true,
     confirmButtonText: 'Yes, sir',
     cancelButtonText: 'Not at all'
 });
</script>
</body>
</html>

javascript syntax sweetalert
person 987654321    schedule 07.10.2015    source источник
comment
вы можете проверить консоль разработчика на наличие ошибок?   -  person kucing_terbang    schedule 07.10.2015
comment
также в консоли есть ласточка как глобальная?   -  person markyph    schedule 07.10.2015
comment
я скопировал и вставил, поэтому сомневаюсь, что это ошибка   -  person 987654321    schedule 07.10.2015
comment
так что же запускает событие? вам нужна кнопка с событием onclick или аналогичным.   -  person markyph    schedule 07.10.2015
comment
@markyph прав, вам не хватает элемента, который запускает событие. Это не похоже на привязку этой функции, и все предупреждения будут перезаписаны. Вы должны определить каждое предупреждение самостоятельно.   -  person Dwza    schedule 07.10.2015

Ответы (2)


arrow_upward
3
arrow_downward

Добавьте кнопку в html и вызовите событие onclick.

например используя стандартные селекторы запросов

document.querySelector('button#test-1').onclick = function(){
  swal({
    title: 'Confirm',
    text: 'Are you sure to delete this message?',
    type: 'warning',
    showCancelButton: true,
    confirmButtonText: 'Yes, sir',
    cancelButtonText: 'Not at all'
  });
};
<link href="http://t4t5.github.io/sweetalert/dist/sweetalert.css" rel="stylesheet"/>
<script src="http://t4t5.github.io/sweetalert/dist/sweetalert.min.js"></script>
<button id="test-1">Show alert</button>

person markyph    schedule 07.10.2015
comment
Я добавил фрагмент к вашему ответу для лучшего использования. - person Dwza; 07.10.2015
comment
спасибо @Dwza - не забуду сделать это в будущем - отличный SO позволяет это сейчас. - person markyph; 07.10.2015

arrow_upward
0
arrow_downward

Просто измените свой код, как показано ниже:

<!DOCTYPE html>
<html>
    <head>
        <title>Testing</title>

        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.33.1/sweetalert2.css">
        <script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.js"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.33.1/sweetalert2.js"></script>

        <script>
            $(document).ready(function(){

                    Swal.fire({
                        title: 'Success',
                        text: "Your sweet alert successfully worked",
                        type: 'success',
                    });

                });
        </script>

    </head>
    <body>

    </body>
</html>
person Natvarsinh Parmar - bapu    schedule 27.05.2019