如何在 sweet alert 2 中启用输入确认按钮

Question

我需要在用户未更改 sweet alert 中文本框中的任何值时禁用确认按钮，并且仅当文本框中的值已更改但我似乎找不到时才启用它一种方法。这是我的代码：

swal({
            title: 'Please Enter Page Name',
            input: 'text',
            inputValue: PageName,
            confirmButtonText: 'Save',
            onOpen: function (){
                swal.disableConfirmButton(); //this disables the button
            }
            preConfirm: function (Name) {
                return new Promise(function (resolve, reject) {
                    resolve();
                })
            },
            allowOutsideClick: false
        })

我使用 onOpen 触发 swal.disableConfirmButton(); 方法，但我不知道在哪里使用 swal.enableConfirmButton();。有没有类似 onInput 之类的功能？如果是，如何使用它来达到预期的结果？

这是我到目前为止所取得的成就的代码笔。

https://codepen.io/zeeshanadilbutt/pen/NLvmZz?editors=0010

Answer 1

由于input: text没有onInput或类似的东西，你可以在onOpen中使用getInput并添加一个事件监听器 相应地启用或禁用您的 button。

检查工作片段。

swal({
  input: 'text',
  onOpen: function () {
    swal.disableConfirmButton();
    swal.getInput().addEventListener('keyup', function(e) {
      if(e.target.value === '') {
        swal.disableConfirmButton();
      } else {
        swal.enableConfirmButton();
      }
    })
  }
});

  <script src="https://unpkg.com/sweetalert2"></script>

如何在 sweet alert 2 中启用输入确认按钮

How can I enable Confirm Button on input in sweet alert 2

javascript

jquery

sweetalert

sweetalert2