在 sweetAlert 中突出显示默认文本输入答案

【问题标题】：Highlighting default text input in sweetAlert在 sweetAlert 中突出显示默认文本输入
【发布时间】：2017-12-04 08:48:09
【问题描述】：

我有一个允许文本输入的SweetAlert2，我给它一个默认值。我希望在弹出警报时突出显示此默认值，以便用户可以在需要时立即覆盖它。这是一个例子：

这是我使用 sweetAlert 选项调用的函数：

window.sweetPrompt = function (title, message, callback, input, keepopen, allowOutsideClick, allowEscapeKey) {
    sweetAlert({
        title: title,
        text: message,
        input: 'text',
        confirmButtonColor: "#428bca",
        preConfirm: function(text) {
            return new Promise(function(resolve) {
                if (!keepopen) {
                    resolve();
                } else {
                    callback(text);
                }
            });
        },
        inputValidator: function(text) {
            return new Promise(function (resolve, reject) {
                if (text) {
                    resolve();
                } else {
                    reject('Cannot be empty!');
                }
            });
        },
        inputValue: input,
        showCancelButton: true,
        reverseButtons: true,
        allowOutsideClick: allowOutsideClick,
        allowEscapeKey: allowEscapeKey
    }).then(callback, function(dismiss){});
};

我将如何去做（如果可能的话）？我考虑过使用 jQuery，但我不确定如何获得对 sweetAlert 对话的引用。任何建议将不胜感激。

【问题讨论】：

标签： javascript jquery sweetalert sweetalert2

【解决方案1】：

给你：

Swal.fire({
  input: 'text',
  inputValue: 'input value',
  didOpen: () => {
    const input = Swal.getInput()
    input.setSelectionRange(0, input.value.length)
  }
})

&lt;script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"&gt;&lt;/script&gt;

PS。请注意 SweetAlert2 和 SweetAlert 是两个不同的项目，API 略有不同。

SweetAlert2 文档：https://sweetalert2.github.io/

【讨论】：