4

onClickをシミュレートするためにIframeを他の要素で「カプセル化」する方法はありますか？Iframeがイベントをサポートしていないことは知っていますが、Iframeを通過するWebサイトからのクリックを追跡する必要があります。

ありがとう！

4

3 に答える 3

5

フレームに同じドメインのページが含まれている場合（同一生成元ポリシーに違反していない場合）、そのドキュメントを直接操作できます。

<script type="text/javascript">
window.onload = function() {
    var oFrame = document.getElementById("myframe");
    oFrame.contentWindow.document.onclick = function() {
        alert("frame contents clicked");
    };
};
</script>

外部ページが含まれている場合は、運が悪いです。明らかなセキュリティ上の理由から、やりたいことを実行する方法はありません。すべてのコンテンツは視覚的に同じページの一部ですが、異なるドメインからのフレームは、スクリプトの観点から分離されている必要があります。そうしないと、どのページでも、たとえばWebメールをロードする非表示のiframeを作成し、そこからセッションCookieを盗む可能性があります。ユーザーはすべてのデータにアクセスできますが、ページの作成者はデータにアクセスできないようにする必要があります。

于 2012-04-09T09:50:43.773 に答える
2

使用してみてください：https ：//github.com/vincepare/iframeTracker-jquery

同一生成元ポリシーのため、親ページからiframeコンテンツ（DOM）を読み取ることはできないため、追跡は、ページ/ iframe境界監視システムに関連付けられたblurイベントに基づいて、いつでもどのiframeがマウスカーソルであるかを通知します。

追跡するiframe要素をjQueryセレクターと照合し、iframeのクリックが検出されたときに呼び出されるコールバック関数を使用してiframeTrackerを呼び出します。

jQuery(document).ready(function($){
    $('.iframe_wrap iframe').iframeTracker({
        blurCallback: function(){
            // Do something when the iframe is clicked (like firing an XHR request)
        }
    });
});

そして、より多くのオプション。

于 2017-06-06T11:42:15.550 に答える
1

上記のスクリプトは、iframeのクリック機能をテストするのに最適です。具体的には、Googleの新しいanalytics.jsトラッキングコードとイベントトラッキングを使用してiframeのクリックを追跡している場合、上記のコードは次のようになります。

<script type="text/javascript">
window.onload = function() {
    var oFrame = document.getElementById("myframe");
    oFrame.contentWindow.document.onclick = function() {
        ga('send', 'event', 'link', 'click', 'My Frame Was Clicked');
    };
};
</script>

iframeは次のようになります（JavaScriptでid = "myframe"が参照されていることに注意してください）。

<iframe id="myframe" src="http://www.yourowndomain.com" scrolling="yes" marginwidth="0" marginheight="0" vspace="0" hspace="0" height="800" style="border:0; overflow:hidden; width:100%;"></iframe>

次に、イベントクリックをテストするために、Googleのイベント追跡に精通している場合は、GoogleAnalyticsダッシュボードの[標準レポート]>[リアルタイム]>[イベント]で、クリックが[イベントアクション：クリック]、[イベントラベル：マイフレームがクリックされました]として表示されます。または、ダッシュボードの[動作]>[イベント]で長期間使用します。

私はこれをテストしました。前のポスターが示したように、これはiframeソースが同じドメインにある場合にのみ機能します。

于 2013-12-20T17:57:32.103 に答える