jquery - sweetAlert - 不在确认按钮点击时调用函数

Question

我通过关注 this 添加了以下警报但是当我单击取消或确认按钮时没有调用任何函数，我做错了什么吗？我的母版页有指向 css 的链接:<link href="css/plugins/sweetalert/sweetalert.css" rel="stylesheet" />

            sweetAlert({
                html: true,
                title: 'Error',
                text: "test",
                type: 'warning',
                showCancelButton: true,
                confirmButtonText: 'Check',            
            }).then((result) => {
                if (result.value) {
                    sweetAlert("Yes", "Blah", "info");
                } else {                   
                    sweetAlert("No", "Blah", "info");
                }
                });

Answer 1

如果您使用的是 jQuery，请在要调用操作的 DOM 元素上附加点击事件，然后触发 SweetAlert 弹出窗口。使用 SweetAlert 或 sweetAlert 实例来触发 (fire) 事件。

这是一个可以帮助您开始的示例:

$(function() {
  const events = {
    click: 'click'
  };
  
  const $button = $('#somethingToDo');
  
  $button.on(events.click, function(event) {
    const config = {
      html: true,
      title: 'Error',
      text: 'test',
      type: 'warning',
      showCancelButton: true,
      confirmButtonText: 'Check',    
    };
    
    // first variant
    sweetAlert.fire(config).then(callback);
    
    function callback(result) {
      if (result.value) {
        // second variant 
        SweetAlert.fire("Yes", "Blah", "info");
      } else {
        // second variant 
        SweetAlert.fire("No", "Blah", "info");
      }
    }
  });
})

<script src="https://cdn.jsdelivr.net/npm/sweetalert2@8.0.6/dist/sweetalert2.all.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/sweetalert2@8.0.6/dist/sweetalert2.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button id="somethingToDo">
  Do something
</button>