時々開発者はタスクを解決する必要があります-にあるサイトを接続する方法IFRAME>タグとJavaScriptを使用した親サイト。 そして、たとえば、何かを即座に更新する方法IFRAME>親サイトで何かが行われたとき? これは以前は問題でしたが、HTML5機能を使用できるようになったため現在は問題ではありません。 次の例を見てみましょうul>アイテム!
- したがって、親サイトにはul>そしてそれを 'として識別できます.providers_list リ'、そしてインターフェースのロジックにより、挿入または削除するいくつかのjsイベントがありますli>そこからul>。 そして、あるサイトでIFRAME>テキストを取得したい そのリンクの そこにあります。
- 親サイトに1つのjsファイルを作成し、サイトに1つのjsファイルを作成します。iframe id = "mdtf_csp_frame">
- 親のjsファイルに次のコードを挿入します。12345678910jQuery(function () {var iframe = jQuery('#mdtf_csp_frame');setInterval(function () {var message=new Array();jQuery('.providers_list li').each(function (i, o) {message.push(jQuery.trim(jQuery(o).find('a').eq(0).text()));});iframe[0].contentWindow.postMessage(message.join(', '), '*');}, 2000);});
- ページが読み込まれた後、開始します セット間隔 2秒ごとにプロバイダーリストをチェックし、その各リンクからテキストを取得する関数
- 次に、HTML5関数を使用します ポストメッセージ 収集したデータをに送信しますIFRAME>
- タグにあるサイトでIFRAME>次のコードを使用する必要があります:123456789101112131415var onmessage = function (e) {var data = e.data;//var origin = e.origin;if (document.getElementById('textarea.wpbdp-field-14') !== null) {document.getElementById('textarea.wpbdp-field-14').readOnly = true;document.getElementById('textarea.wpbdp-field-14').innerHTML = data;}};if (typeof window.addEventListener != 'undefined') {window.addEventListener('message', onmessage, false);} else if (typeof window.attachEvent != 'undefined') {window.attachEvent('onmessage', onmessage);}
- wpbdp-14 is textarea タグにあるサイトでIFRAME>そして親サイトリストから2秒ごとに新しい情報を追加します '.providers_list リ'.
以上です。 別の場合に使用できるのと同じ原則...