sweetAlert-在单击确认按钮时未调用函数

时间:2019-02-11 23:17:39

标签: jquery css asp.net

我通过遵循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");
                }
                });

1 个答案:

答案 0 :(得分:1)

如果您使用的是jQuery,请在要调用操作的DOM元素上附加click事件,然后触发SweetAlert弹出窗口。使用SweetAlertsweetAlert实例来触发(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>