Monaca iPhoneでの数値入力はフリックとともに。。。

すっかりMonacaづいてるくまかけです！

あいかわらずinputタグの動作にはハメられています(^^;

Androidではきちんと動くんだから、iPhoneでも動いてくれたらいいんですが、どっこい、そうもいかないシーン満載です。。。

先日は、フォーカスが抜ける件でドタバタしたし(^^;

今回ハマったのはこんな現象。

前提

・２つの数値入力フィールドがあり、どちらかの値が変更された差分を計算します。

・入力フィールドは<input type=numeric … >とons-inputは使っていません。

・数値が入力されたことの検出にはonKeyUpイベントで処理をしています。

現象

たとえば、1000と入力すると、iPhoneでは1…と表示され、候補に1000が出てくるのでそれをクリックします。

入力フィールドには1000が設定されるのですが、差分計算が動作しません。

ここで、「確定」→「改行」になっているボタンをクリックすると、差分計算が動作しました。

ちなみに、iPhoneの設定で「フリックしか使わない」としてると、1…という結果にならず、きちんと1000となってくれて、差分計算が動作します。

※わたしのiPhoneは「フリックしか使わない」としているので、1…が表示されず、現象の再現に悩みました(^^;

現象からすると、onKeyUpイベントが候補を選択しただけでは発火せずに、「改行」をクリックすることで発火するようです。

対策

今回はtype=numericとしているので、onChangeイベントはNGなので、もう一つのイベント。

そう、onInputイベントを利用しました。

いつもながら、なかなかにハメられ・・・・いやいや、勉強させられます。

この試練は次回からのにしっかり生かさせてもらいます(^^)

あとがき。。。。

Androidで作ってテストしてからiPhoneの動作確認としてきたのですが、感覚としてAndroidで動いたからと言ってiPhoneでは動作しないケースが散見されます。

その逆は、ほぼ体験していません。

そのため、iPhoneで動作革新してからAndroidで動作確認をするようにしています。

このときは、LocalKitのリモートデバッグが便利です(^^)