如何在甜蜜警報2中的輸入上啟用確認按鈕

Question

當用戶沒有更改甜蜜警報內的文本框中的任何值時，我需要禁用確認按鈕，並且只有當文本框中的值發生變化時才啟用它，但我似乎無法找到解決方法。 這是我的代碼：

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或類似input: text ，因此可以在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>