問題タブ [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.

0 投票する
1 に答える
104 参照

javascript - 長いコンテンツを含む iframe フォームを送信すると、ありがとうメッセージが表示されません。表示するには、親を上にスクロールする必要があります

このデモ ページ(クロスドメイン)に (私がホストする) フォームを配置しています。親と子の両方にコードを追加できます。

iframe の自動サイズ変更は ( iframe-resizerを使用して) 完璧に機能しますが、モバイルまたはデスクトップでウィンドウが狭い (スクロールバーが長い) フォームを送信すると、お礼のメッセージがすぐに表示されません。親ページを表示するには、親ページを少し上にスクロールする必要があり、混乱を招く可能性があります。

iframe は適切なサイズに完全に縮小されていますが、カスタム postMessage を実行して、埋め込まれた iframe の上部までページをスクロール/ジャンプするように親に指示する必要があります。

既存の iframe-resizer スクリプトを使用する方法について何か考えがありますか、またはそれなしで postMessage を実行できますか?

前もって感謝します!

0 投票する
2 に答える
5215 参照

javascript - React JS ページをコンテンツとして iFrame Resizer を使用する

外部の CMS ページに React ページの iFrame がありますが、高さを自動的に調整したいと考えています。

このライブラリを使用しようとしています: https://github.com/davidjbradshaw/iframe-resizer ですが、残念ながら正しく実装できません... React プロジェクトで設定する必要があるかどうか、どこで設定する必要があるかわかりません特定のパラメーター/呼び出し関数と、この JS ファイルをインポートする場所。

ここの指示とオンラインの特定のチュートリアルに従ってみました: https://github.com/davidjbradshaw/iframe-resizer

ただし、それは常にホスト ページに実装する方法にすぎません。

ホストページにスクリプトを既に含めました:

私の理解では、ドキュメントで読んだことから React プロジェクトのどこかで iFrameResizerContentWindow を呼び出す必要がありますが、これを行う正しい方法が何であるかはよくわかりません。ドキュメントは私を少し混乱させています。誰かが私を助けることができれば、それは非常に高く評価されます!