jQuery：移动设备的按键事件

Question

我在 iPhone 上触发 keyup 事件时遇到了一些问题，我的代码如下：

        var passwordArray = ["word", "test", "hello", "another", "here"];

        var test = document.getElementById('enter-password');
        test.addEventListener('keyup', function(e) {

            if (jQuery.inArray(this.value, passwordArray) != -1) {
                alert("THIS IS WORKING");
            } else {}

        });

想法是，当用户在 #enter-password 字段中输入内容时，当他们与 passwordArray 中的单词匹配时，警报就会触发。这适用于桌面，例如输入 word 后，该功能将在您输入 d 后立即触发。有没有办法让它也适用于移动设备？

Answer 1

触摸点从设备上移除时触发 touchend 事件。

https://developer.mozilla.org/en-US/docs/Web/Events/touchend

您可以将 keyup 和 touchend 事件传递到 .on() jQuery 方法（而不是 keyup() 方法）以在这两个事件上触发您的代码。

test.on('keyup touchend', function(){
//code
});

Answer 2

您可以添加输入事件。这是一个只要输入发生变化就会触发的事件。输入在桌面和手机上都有效

test.on('keyup input', function(){
  //code
});

您可以查看此答案以了解有关 jQuery Input Event

的更多详细信息

Answer 3

您可以使用三个事件（但您必须小心"combine"它们的使用方式）：

keyup ：它适用于带键盘的设备，当您释放一个键时触发（任何键，甚至是不显示任何内容的键）屏幕，例如 ALT 或 CTRL）；
touchend：它适用于触摸屏设备，当您从显示屏上移除 finger/pen 时触发；
input：当您按下一个键 "and the input changes" 时触发（如果您按下 ALT 或 CTRL 等键，则不会触发此事件）。

input 事件适用于键盘设备和触摸屏设备，指出这一点很重要，因为在已接受的答案中，示例是正确的但近似：

test.on('keyup input', function(){
}

在基于键盘的设备上，此函数被调用两次，因为事件 keyup 和 input 将被解雇。

正确答案应该是：

test.on('keyup touchend', function(){
}

（对于 desktops/laptops，该函数在 keyup 上调用，对于手机，在 touchend 上调用）

或者您可以简单地使用

test.on('input', function(){
}

但请记住，input 事件不会被所有键触发（CTRL、ALT 等不会触发事件）。

Answer 4

您应该添加一个输入事件。它适用于移动设备和计算机设备。

jQuery：移动设备的按键事件

jQuery: keyup event for mobile device

javascript

mobile

jquery

click

keyup