同时使用 dangerMode 和 input - sweetalert

Question

我使用Sweet Alert，所以在执行危险操作之前，我会弹出对话框。例子.

swal({
  title: "Are you sure?",
  text: "Once deleted, you will not be able to recover this imaginary file!",
  icon: "warning",
  buttons: true,
  dangerMode: true,
})
.then((willDelete) => {
  if (willDelete) {
    swal("Poof! Your imaginary file has been deleted!", {
      icon: "success",
    });
  } else {
    swal("Your imaginary file is safe!");
  }
});

但用户可以根据需要输入任何备注，这是可选的，不是必需的。所以就会变成这样

所以我把代码修改成这样

function RequestUpload(value) {

                swal({
                    title: "Are you sure?",
                    text: "Are you sure want to request to upload?",                   
                    icon: "warning",
                    buttons: true,                   
                    dangerMode: true,
                    content: {
                        element: "input",
                        attributes: {
                            placeholder: "Any remarks?",
                            type: "text",
                        },
                    },
                })
                    .then((willDelete,input) => {
                        if (willDelete) {

                            swal(`You typed: ${input}`);
                            //Call ajax here

                            
                        }
                        else {
                            swal(`Is not delete`);
                        }
                       
                    });

            
            }

但我无法从输入中获取值，它一直显示 undefined。

知道如何解决这个问题吗？

Answer 1

输入值作为第一个参数提供。当您单击取消时，单击弹出窗口外部或按 ESC，您将获得 null 作为将关闭警报的值（即：触发您的其他）。否则，如果您单击“确定”，它将保留您的输入值：

.then((input) => {
  if (input !== null) {
    swal(`You typed: ${input}`);
    //Call ajax here
  } else {
    swal(`Is not delete`);
  }
});

function RequestUpload(value) {
  swal({
      title: "Are you sure?",
      text: "Are you sure want to request to upload?",
      icon: "warning",
      buttons: true,
      dangerMode: true,
      content: {
        element: "input",
        attributes: {
          placeholder: "Any remarks?",
          type: "text",
        },
      },
    })
    .then((input) => {
      if (input !== null) {
        swal(`You typed: ${input}`);
        //Call ajax here
      } else {
        swal(`Is not delete`);
      }
    });
}

RequestUpload();

<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>

同时使用 dangerMode 和 input - sweetalert

Use dangerMode and input in same time - sweetalert

javascript

jquery

sweetalert