突出显示sweetAlert中的默认文本输入

问题描述 投票:6回答:1

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

enter image description here

以下是我使用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个回答
5
投票

干得好:

Swal.fire({
    input: 'text',
    inputValue: 'input value',
    onOpen: function() {
      var input = swal.getInput()
      input.setSelectionRange(0, input.value.length)
    }
 })
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@8"></script>

PS。请注意,SweetAlert2和SweetAlert是两个不同的项目,在API方面略有不同。

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

© www.soinside.com 2019 - 2024. All rights reserved.