ホームページ >ウェブフロントエンド >htmlチュートリアル >iOS で iframe がサポートされていない問題を解決するにはどうすればよいですか?
iOS で iframe がサポートされていない問題を解決するにはどうすればよいですか?
- 零下一度オリジナル
- 2017-07-20 13:27:563768ブラウズ
iframe には奇妙な問題がたくさんあり、多くの Android スマートフォンも正常ではありません。
アプリで iframe を使用することはお勧めできません。
ダブル Web ビューの方が安全です。つまり、最初に iframe に配置したページを Web ビューにロードし、それをメイン ページに追加します
具体的なパフォーマンスは、ネストされたサブページの高さが親ページの高さよりも大きい場合です。ページ上でポップアップ イベントがトリガーされたとき、子ページの高さが親ページの高さよりもはるかに大きい場合、実際にはポップアップ ボックスが見つからない可能性があります。ポップアップ ボックスの位置はビューポートに対してではなく、子ページに対してのみ配置されます。多くの方法を試しましたが、どれも理想的なものではなく、Android システムのパフォーマンスが良好だったので、iOS システムはページに直接ジャンプできるのに対し、Android システムは通常 iframe を使用するのではないかと考えました (Android システムがページに直接ジャンプすると、つまり、物理的なリターンキーが押されたときに、前のフォーム送信ページの内容を正常にクリアできません。また、複数のフォームがネストされている場合、対応するフィールドが混乱するため、iframeを使用してください）。コードを見てください。直接:
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0"><title>网上申请</title></head><body><script src="js/zepto.min.js?1.1.11"></script><script>$(function() {var originId = sessionStorage.setItem('originId', '3'); //originId为后台需要判断是哪个入口的值var u = navigator.userAgent;var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端if (isAndroid) {//安卓终端使用iframevar winH = $(window).height();var iframe = document.createElement('iframe');
iframe.src = "index_common.html";
iframe.style.width = '100%';
iframe.style.height = winH + 'px';
iframe.style.border = '0 none';
iframe.setAttribute('scrolling', 'auto');
document.body.appendChild(iframe);
} else if (isiOS) {//iOS终端直接页面跳转 location.href = 'index_common.html';
} else {
location.href = 'index_common.html';
}
})</script></body></html>私は長い間私の成長を記録してきました。同じような問題に遭遇した友人がいる場合は、改善できる点を見つけてアドバイスをいただければ幸いです。
以上がiOS で iframe がサポートされていない問題を解決するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。