在键盘弹起或改变事件时，使用jQuery触发Ajax以发送数据。

Question

我尝试过keyup和change函数，以下是它们无法成功的原因。用户输入代金券代码后，我想发送一个ajax请求来检查代金券是否存在于数据库中。我已尝试：

$('#discount-voucher').keyup(function(event) {
    // Get the value
    let value = $(this).val()

    // Check if exists
    $.ajax({
        url: '{{ route('get-voucher') }}',
        type: 'POST',
        data: {_token: '{{ csrf_token() }}', code: value}
    })
    .done(function(data) {
        if (data == 'error') {
            $('span#voucher-error').text('Неавлиден ваучер')
        }
    })
    .fail(function() {
        console.log("error")
    })
    .always(function() {
        console.log("complete")
    })
})

但是，这些代金券将通过电子邮件发送，假设用户复制粘贴它们。这样是行不通的。 并且使用change函数时，用户必须在输入框外单击或按Enter键才能生效，我不希望出现这种情况，也不想出现提示/提示，提示用户“单击输入框外部或按Enter键以检查代金券是否有效”。所以我需要的是类似于change函数的东西，可以在没有点击或按Enter键的情况下生效。

- Angel Miladinov

---

为什么 keyup/keydown 不起作用？ - freginold

他在问题中说，除了键盘输入值的方式还有其他方法。 - Mark Baijens

@MarkBaijens 哦，明白了，谢谢。一开始以为他是指从表单中复制/粘贴。 - freginold

Answer 1

有一个粘贴事件，您可以设置多个事件监听器，如下所示：

$('#discount-voucher').on('keyup paste change', function () {
      //Do something  . . . .
});

此外，您可能需要对 AJAX 请求进行限流，以避免因打字过快而频繁调用它。

- john Smith

---

我已经尝试过了，但是我仍然需要点击元素外部或按下回车键。 - Angel Miladinov

@TheAngelM97 你可以添加你需要的事件，比如focusin和focusout。 - SilverSurfer

问题在于当我再次复制粘贴凭证时，我必须点击元素外部才能激活函数。使用focusin，我将在粘贴凭证之前聚焦输入，函数将被激活，但值将为空，然后在粘贴凭证后，我将再次不得不点击元素外部。 - Angel Miladinov

移除 keyup paste 和 change 之间的点号：$('#discount-voucher').on('keyup paste change', function () { - SilverSurfer