クレジットカードを利用する必要のあるショッピングカートアプリがあります。クレジットカード番号は、4つの異なる入力フィールドに並べて入力されます。これは、ほとんどのクレジットカードが16桁で、4つのグループに分割されているためです。これらのフォームフィールドへの入力を簡単にするための優れた効果があります。ユーザーが4文字を入力すると、フォーカスが次の入力フィールドに自動的に設定されます。
これはiOSデバイスでは機能しません。フォーカスを変更すると、キーボードが下がり、他に何も起こりません。
これを容易にするために、私はキー押下をキャプチャしています:
$('input:regex(id, ^cc)').unbind("keyup").keyup(function(e) {
var element = e.target;
if($(element).val().length == 4) {
var cid = $(element).prop('id');
var prefix = cid.substr(0, 4);
var number = cid.substr(4, 1);
var postfix = cid.substr(5, cid.length);
//Use closest UL so that we stay within the bounds of this card
$(element).closest('ul').find('#' + prefix + ++number + postfix + ':first').focus();
}
});
入力フィールドには、jqueryコールバックの最後の行を説明するID'cc-1'、'cc-2'などが列挙されています。構文の問題は無視してください。私はこのコードをスクラブしましたが、途中でいくつかの間違いを犯した可能性があります。率直に言って、コードに問題はないと思います。iOSの問題だと思います。
ユーザーの操作なしにキーボードを表示させることはできないことは知っていますが、キーを押してユーザーの操作を行わないのですか?誰かが回避策を知っていますか?