web-dev-qa-db-ja.com

jQuery：モバイルデバイスのキーアップイベント

IPhoneでキーアップイベントを起動するのにいくつか問題があります。コードは次のとおりです。

        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に一致したときにアラートが発生します。これはデスクトップで動作します。 Wordを入力すると、dを入力するとすぐに関数が起動します。とにかくこれをモバイルでも機能させる方法はありますか？

javascriptjquerymobileclickkeyup
11
user1374796

入力イベントを追加できます。これは、入力が変更されるたびにトリガーされるイベントです。入力はデスクトップでも携帯電話でも機能します

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

jQuery Input Event の詳細については、この回答を確認できます

24
Joyson

使用できるイベントは3つあります（ただし、それらをどのように「結合」するかに注意する必要があります）。

  • keyup：キーボードを備えたデバイスで動作します。キー（任意のキー、ALTやCTRLなど、画面に何も表示されないキーも含む）を離すとトリガーされます。

  • touchend：タッチスクリーンデバイスで動作し、ディスプレイから指/ペンを離すとトリガーされます。

  • input：「入力が変更される」キーを押すとトリガーされます（ALTまたはCTRLなどのキーを押した場合、このイベントは発生しません）。

inputイベントは、キーボードデバイスおよびタッチスクリーンデバイスで動作します。受け入れられた回答では例は正しいが近似であるため、これを指摘することが重要です。

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

キーボードベースのデバイスでは、この関数は2回呼び出されますイベントkeyupとinputの両方が発生するためです。

正解は次のとおりです。

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

（この関数は、デスクトップ/ラップトップの場合はkeyupで呼び出されますOR on touchendの場合はモバイル）

または、単に使用することができます

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

ただし、inputイベントはすべてのキーでトリガーされるわけではありません（CTRL、ALT＆co。はイベントを発生させません）。

12
Frank

Touchendイベントは、タッチポイントがデバイスから削除されると発生します。

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

Keyupおよびtouchendイベントを.on（）jQueryメソッド（keyup（）メソッドの代わりに）に渡して、これらのイベントの両方でコードをトリガーできます。

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

入力イベントを追加する必要があります。モバイルデバイスとコンピューターデバイスの両方で動作します。

0
user10643043