問題タブ [iframe-resizer]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - 長いコンテンツを含む iframe フォームを送信すると、ありがとうメッセージが表示されません。表示するには、親を上にスクロールする必要があります
このデモ ページ(クロスドメイン)に (私がホストする) フォームを配置しています。親と子の両方にコードを追加できます。
iframe の自動サイズ変更は ( iframe-resizerを使用して) 完璧に機能しますが、モバイルまたはデスクトップでウィンドウが狭い (スクロールバーが長い) フォームを送信すると、お礼のメッセージがすぐに表示されません。親ページを表示するには、親ページを少し上にスクロールする必要があり、混乱を招く可能性があります。
iframe は適切なサイズに完全に縮小されていますが、カスタム postMessage を実行して、埋め込まれた iframe の上部までページをスクロール/ジャンプするように親に指示する必要があります。
既存の iframe-resizer スクリプトを使用する方法について何か考えがありますか、またはそれなしで postMessage を実行できますか?
前もって感謝します!
javascript - React JS ページをコンテンツとして iFrame Resizer を使用する
外部の CMS ページに React ページの iFrame がありますが、高さを自動的に調整したいと考えています。
このライブラリを使用しようとしています: https://github.com/davidjbradshaw/iframe-resizer ですが、残念ながら正しく実装できません... React プロジェクトで設定する必要があるかどうか、どこで設定する必要があるかわかりません特定のパラメーター/呼び出し関数と、この JS ファイルをインポートする場所。
ここの指示とオンラインの特定のチュートリアルに従ってみました: https://github.com/davidjbradshaw/iframe-resizer
ただし、それは常にホスト ページに実装する方法にすぎません。
ホストページにスクリプトを既に含めました:
私の理解では、ドキュメントで読んだことから React プロジェクトのどこかで iFrameResizerContentWindow を呼び出す必要がありますが、これを行う正しい方法が何であるかはよくわかりません。ドキュメントは私を少し混乱させています。誰かが私を助けることができれば、それは非常に高く評価されます!