Question

问题

我正在使用SweetAlert2，在其中打开包含自定义HTML的警报，其中显示了一些输入框。我想使用SweetAlert2的常规确认/取消按钮将这些输入的值发送到套接字。

问题

如何使用普通的SweetAlert2按钮获取这些输入的值？请不要建议使用普通输入或HTML按钮，因为这是一种解决方法，我不希望这样。

环境

我使用jQuery，SweetAlert2和一些不相关的库，如Vue.js和Socket.io等。

代码

Metric  Min 25th Percentile Median  75th Percentile Max
Duration    47 ms   0.1 s   5 s 25 s    **1.0 min**
GC Time 0 ms    0 ms    0 ms    0.1 s   0.7 s
Input Size/ Records 438.0 B/1   1013.0 B /2 1776.0 B/ 12    128.2 MB / 277608   **128.5 MB / 1162416**
Shuffle Write size/Records  240.0 B/1   446.0 B /1  509.0 B / 1 622.0 B /1  **2.3 KB /1**

Answer 1

由于您使用的是自定义HTML输入，因此库API中的常规设置不足以实现您的目标。我建议您使用API函数中的preConfirm来获取输入中的值，如下所示：

function addUser() {
    swal({
        html: `...`,
        confirmButtonText: 'Confirm',
        // ...
        showCancelButton: true,
        preConfirm: function() {
            return new Promise((resolve, reject) => {
                // get your inputs using their placeholder or maybe add IDs to them
                resolve({
                    Email: $('input[placeholder="Email"]').val(),
                    Name: $('input[placeholder="Name"]').val(),
                    Password: $('input[placeholder="Password"]').val(),
                    Level: $('input[placeholder="Level"]').val()
                });

                // maybe also reject() on some condition
            });
        }
    }).then((data) => {
        // your input data object will be usable from here
        console.log(data);
    });
}

SweetAlert2从自定义HTML中的输入中获取值

1 个答案: