sweetalert 2上有2个以上的按钮 [英] More than 2 buttons on sweetalert 2

问题描述

我有一个带有2个按钮的sweetalert，但我想再添加一个按钮。
例如，截至目前，我有，我不想再添加一个按钮。请帮助

I have a sweetalert with 2 buttons but I want to have one more button in it. For example, as of now, I have yes and no I want to add one more button say later. please help

$("#close_account").on("click", function(e) {
        e.preventDefault();
        swal({
          title: "Are you sure?",
          text: "You will not be able to open  your account!",
          type: "warning",
          showCancelButton: true,
          confirmButtonColor: "#DD6B55",
          confirmButtonText: "Yes, close my account!",
          closeOnConfirm: false
        },
        function(){
          window.location.href="<?php echo base_url().'users/close_account' ?>"
        });
    });

提前致谢：）

推荐答案

你应该使用带有jQuery事件绑定的自定义HTML，它的工作方式几乎相同，只需要自己为按钮添加样式，因为SweetAlert类对我不起作用。

You should use custom HTML with jQuery event bindings, it works almost the same, only problem that you need to add styling for buttons by yourself because SweetAlert classes don't work for me.

$(document).ready(function() {
  $("#close_account").on("click", function(e) {
    var buttons = $('<div>')
    .append(createButton('Ok', function() {
       swal.close();
       console.log('ok'); 
    })).append(createButton('Later', function() {
       swal.close();
       console.log('Later'); 
    })).append(createButton('Cancel', function() {
       swal.close();
       console.log('Cancel');
    }));
    
    e.preventDefault();
    swal({
      title: "Are you sure?",
      html: buttons,
      type: "warning",
      showConfirmButton: false,
      showCancelButton: false
    });
  });
});

function createButton(text, cb) {
  return $('<button>' + text + '</button>').on('click', cb);
}

<link href="https://cdn.jsdelivr.net/sweetalert2/4.2.4/sweetalert2.min.css" rel="stylesheet"/>
<script src="https://cdn.jsdelivr.net/sweetalert2/4.2.4/sweetalert2.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button id="close_account">Show</button>

这篇关于sweetalert 2上有2个以上的按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！