sweetAlert - 单击确认按钮时不调用函数答案

【问题标题】：sweetAlert - not calling function on confirm button clicksweetAlert - 单击确认按钮时不调用函数
【发布时间】：2019-07-05 12:54:54
【问题描述】：

我通过关注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");
                }
                });

【问题讨论】：

Sweet alert 也需要包含它的 .js 文件

标签： jquery css asp.net

【解决方案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>

【讨论】：