H5ページは、iOS上の問題を解決するために

1、終了後にページコンテンツの上部に、収納iOSモバイルソフトキーボードは、元の場所に落ちていません

コードは以下の通りであります：

$（関数（）{ 
        $（ '入力、TEXTAREA'）（ 'ブラー'、関数（）{オン。
            window.scroll（0,0）; 
        }）; 
        （ '変更'上の$（ '選択'）。関数（）{ 
            window.scroll（0,0）; 
        }）; 
 }）

入力ボックスが十分にscrollYように0に戻って焦点を合わせる失うとき、：原則はwindow.scrollYは（200例）、キーボードの高さに0から変更されたときに、キーボードがポップアップ表示されます。

しかし、非常に深刻な問題がある：ページのボタンを操作する必要がある場合は、例えば、コメント入力ボックスが+、ボタンを離し完全なテキストを入力し、クリックイベントが発生したとき、それはぼかしイベントをトリガするページが発生します、「公開」のキーボードをクリックしてくださいダウン、その後、すべてが終わりました。。。。どんな役割を果たしていないボタンをクリックします。

ソリューション：ontouchstartにクリックイベントを交換すると、この問題を解決することができます。クリックイベントよりも良いontouchstartイベントがトリガされます。

図2に示すように、携帯端末の入力、ボタン等の異なるスタイルの溶液に及びアンドリュースIOS

入力を選択し、ボタン{ 
　　-webkit-外観：なし。
　　外観：なし。
}

IOSは、デフォルトのスタイルを削除することができます

3、IOSは、プルアップおよびスクロールバーケイトンダウン、スロー

本体{ 

 -webkitオーバーフロースクロール：タッチ。
 オーバーフロースクロール：タッチ。

}

4、IOSページのドラッグ問題

{体
指がタッチスクリーンから除去された場合/ *、スクロール* /直ちに停止
 -webkitオーバーフロースクロール：自動
 オーバーフロースクロール：自動
}

5、下の入力ボックスのiPhoneとiPadのデフォルトの影

-webkit-外観：なし。

6、発行日

YYYY-MM-DD HHの場合：MM：IOSシステムにおけるSS形式は認識されません。

適切ブラウザで処理時のフォーマットは、移動端末に、それはNAN、またはnullからなり、この場合には、このタイプのシステムの変換は、IOS時間できませんです。

日付=新しい日付を聞かせて（「2019年2月28日18時33分24秒」）; // ヌル

ソリューション：YYYY / MM / DD HHに変身：mm：ssの形式でそれ。

replace(/-/g, "/")

7、マイクロ文字のアプレットのWebViewは、キーボード引っ込め、ページの一番下が空白のIOS

自動に設定することが疑われるこの問題は、ページが原因スクロールします。

ソリューション：

後にバグを再現限り、あなたは、ページが正常に戻ってページをスクロール見えるようにすることができますとして発見されたので、あなたはそれを呼び出すために望んでいたことができ、操作を完了するために、入力ページのスクロール後フォーカスを失うと、実際にできることを見出しました。その後、次のコードが生成されます

temporaryRepair（）{ 
    VARのcurrentPosition、タイマ; 
    。VAR =スピード1; //ページのスクロール距離
    タイマのsetInterval（関数（）{= 
        ; currentPosition = document.documentElement.scrollTop || document.body.scrollTop 
        currentPosition- =スピード、
        window.scrollToは（0、currentPosition）; //ページをスクロールアップ
        currentPosition + =速度; //速度可変
        window.scrollToは（0、currentPosition）; //スクロールダウンし
        てclearInterval（タイマ）; 
    }、1）; }

いくつかのオフセット機械カーソルTEXTAREAもたらす8、iPhone固定故障、

解決策：自動：すべての兄弟は、親要素のオーバーフロー絶対になりました。

父元素{ 
高さ：100VH。
位置：相対; 
オーバーフロー：自動;} 

兄弟元素{ 
位置：絶対。
トップ：0; 
下：0; 
左：0; 
右：0; 
オーバーフロー-X：見えます。
オーバーフロー-Y：オート。
パディング下：10pxの; 
z屈折率：1;}

9、キーボード入力ボックスシャッター

キーボードの上部から下部に固定される固定入力ボックスは、障害iphone上に固定されている場合、ページのスクロールボックスで入力をスクロールし、ページの結果は、一部のモデルでは、入力ボックスには、隠れたキーボードは、時折ようになっています質問散発、とてもフレンドリー。

ソリューション：そこに転がり、絶対にあきらめている場合は、絶対に使用するように強制すると、オフセットの上にカーソルを参照してください、ページを固定レイアウトの使用を断念。フレックスレイアウトの使用を推奨、互換性が解決されます。

もちろん、あなたが製品設計が必要であれば、非常に不合理である、またはデザインを交換することを示し、これらの問題が発生した場合、入力キーボードを変更するデザインをジャッキアップする必要はありません、これらの互換性ソリューション、また完璧にすることはできませんすべてのモデルのための問題。

図10に示すように、灰色半透明のマスクときにタッチ素子IOSとAndroid

-webkit-TAP-ハイライト色：RGBA（255,255,255,0）

11、トップステータスバーの背景色

<メタ名=「リンゴモバイルウェブアプリ - ステータスバースタイル」コンテンツ=「黒」/>

説明：

あなたは、最初の使用のリンゴ - モバイルウェブアプリ対応のフルスクリーンモードを指定するには、それ以外のメタタグは効果がありませんない限り。

コンテンツがデフォルトに設定されている場合は、ステータスバーが正常に表示されます。空白に設定すると、ステータスバーには、黒い背景を持つことになります。あなたは空白半透明、黒の半透明のステータスバーが表示さに設定されている場合。

デフォルト、または空白に設定すると、そのページはブロックされ、他のカバーせずにステータスバー、トップ部分によって占有され、ステータスバー、ページによって占められ、底部、またはその両方の下に表示されます。

ブランクが半透明に設定すると、ページが画面いっぱいになる、ページの上部をカバーする（ページが20ピクセルの高さをオーバーライドし、iPhone4のとitouch4網膜画面40ピクセル）のステータスバーです。

デフォルト値はデフォルトです。

キーボードイベントは、KeyDownイベントkeyUpイベントIOS入力で12は、キー入力のサポートは非常に良いではありません

問題は、これは、入力された検索時間とあいまい検索を行うAjaxのバックグラウンドを経由して、キーボードのキーワード内のクエリを入力し、そのデータ、赤でキーワードによって返されたデータを返すことです。

入力キーボードでからkeyupイベントを聞いた後、アンドロイドでのモバイルブラウザは可能ですが、赤IOSのモバイルブラウザは、以下を削除することによって、ないすぐからkeyupイベントは、それぞれに対応した入力方法により、非常に遅く、入力されました！

ソリューション：

oninputイベントHTML5からkeyupを置き換えるために使用することができ、その後、同様の効果からkeyupに達しました！

<スクリプトタイプ= "テキスト/ javascriptの"> 
 のdocument.getElementById（ 'testInput'）のaddEventListener（ '入力'、関数（E）{ 
   VAR値= e.target.value; 
 }）; 
</ SCRIPT>

H5ページは、iOS上の問題を解決するために

ソリューション：

おすすめ