jquery 如何在甜蜜警报2中启用输入时的确认按钮

n3h0vuf2  于 2023-10-17  发布在  jQuery
关注(0)|答案(2)|浏览(123)

我需要禁用确认按钮时,用户还没有改变任何价值的文本框内的甜蜜警报,并启用它只有当文本框中的值已经改变,但我似乎找不到一种方法。下面是我代码:

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

yeotifhr

yeotifhr1#

由于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>
bejyjqdl

bejyjqdl2#

我们可以通过getConfirmButtondidOpen启用/禁用确认按钮(this部分不在文档中)
SweetAlert2 v11

Swal.fire({
            title: 'Alert',
            didOpen: function () {
                Swal.getConfirmButton().setAttribute('disabled', 'true')
            }
        })

相关问题