编程语言
首页 > 编程语言> > javascript – 如何使用Sweet警报

javascript – 如何使用Sweet警报

作者:互联网

这是我的HTML代码
当用户点击任何按钮时,我有两个输入按钮,我想要显示甜蜜警报

<tr class="examples odd" id="UserId_1" role="row">
   <td class="sorting_1">1</td>
   <td>admin</td><td>Mohammad</td>
   <td>Farzin</td><td class="warning"><input type="button"
   value="Delete" class="sweet-5" id="btn_Delete1"></td>
</tr>
<tr class="examples even" id="UserId_5" role="row">
   <td class="sorting_1">2</td>
   <td>11</td><td>11</td>
   <td>11</td><td class="warning"><input type="button" value="Delete" class="sweet-5"
   id="btn_Delete5"></td>
</tr>   

脚本

$(document).ready(function () {
document.querySelector('td.warning input').onclick = function () {
    swal({
        title: "Are you sure?",
        text: "You will not be able to recover this imaginary file!",
        type: "warning",
        showCancelButton: true,
        confirmButtonClass: 'btn-danger',
        confirmButtonText: 'Yes, delete it!',
        cancelButtonText: "No, cancel plx!",
        closeOnConfirm: false,
        closeOnCancel: false
        },
     function (isConfirm) {
        if (isConfirm) {
            swal("Deleted!", "Your imaginary file has been deleted!", "success");
            } else {
                swal("Cancelled", "Your imaginary file is safe :)", "error");
            }
        });
    };

});

只有第一个输入按钮显示甜蜜警报,但是
当我点击第二个按钮时没有任何反应

解决方法:

您可能正在使用SweetAlert version 2,您的代码适用于版本1.
这应该工作:

swal({
  title: 'Are you sure?',
  text: 'Some text.',
  type: 'warning',
  showCancelButton: true,
  confirmButtonColor: '#DD6B55',
  confirmButtonText: 'Yes!',
  cancelButtonText: 'No.'
}).then(() => {
  if (result.value) {
    // handle Confirm button click
  } else {
    // result.dismiss can be 'cancel', 'overlay', 'esc' or 'timer'
  }
});
<script src="https://unpkg.com/sweetalert2@7.8.2/dist/sweetalert2.all.js"></script>

资源:
Migration from Swal1 to Swal2

标签:sweetalert,javascript,jquery
来源: https://codeday.me/bug/20190728/1560174.html