登録フォームに電話番号のフィールドがあるWebアプリケーションがあります。実際、3つのテキストボックスで構成されています。1番目と2番目のテキストボックスでは3桁の入力が可能で、3番目のテキストボックスでは4桁の電話番号の入力が可能です。1番目のボックスに3桁が入力されているかどうかをチェックし、2番目のボックスにオートフォーカスするJS機能があります。2番目のボックスに3桁を入力すると、3番目のボックスにオートフォーカスされます。この機能は、IE、FirefoxChromeで機能します。
しかし、iPhoneまたはIpadを介してこのアプリケーションを実行しようとすると、機能しません。1番目のテキストボックスに3桁を入力した後、2番目のテキストボックスにオートフォーカスすることを期待していますが、機能しません。2番目のボックスを手動でタップしてから、その2番目のボックスにデータを入力します。
これがiphoneでどのように機能するかです。
iPhoneでは、最初の3桁が入力され、タッチスクリーンのキーパッドは開いたままになります。4桁目を入力すると(次のフィールドに移動することを期待して)、キーパッドが消えます。次のフィールドに移動するには、フィールドをタップしてキーパッドを戻す必要があります。そうすると、カーソルがそのフィールドに移動します。次のフィールドでも同じことが起こります。
これが私がonkeyupを使っている関数の定義です
function chkLengthPhone(){
if(document.getElementById('ph_no1').value.length == 3)
{
document.getElementById('ph_no2').focus();
}
if(document.getElementById('ph_no2').value.length == 3)
{
document.getElementById('ph_no3').focus();
}
}
何か提案をお願いします。