火災はiframeを押し

Question

はので、ここでこの1には良い数時間を過ごすと良い解決策を見つけることができませんでしたが行く同じボタンにフォームを送信：

私はiframe内にトラッキングピクセルを持っています。ボタンをクリックすると、最初にトラッキングピクセルを発生させてからフォームを送信します。通常、私はピクセルを発射してフォームを渡すページを中央に持っていますが、このプロジェクトではバックエンドにアクセスできず、中間ページも作成できません。私は単純にボタンにonClick = 'firePixel（）を追加しようとしましたが、フォームを送信し、iframeをロードすると仮定していますが、そうではありません。私は2番目の関数を作成して、コールバックとしてonClick（firePixel（submitForm））をコールバックとして追加しようとしました。

P.Sまた、私はフォームの外にボタンを持っているようにしようとしました。

ここで何がベストプラクティスですか？ iframeがバックグラウンドで起動されているかどうかは気にしません。ユーザーは見たことがなく、単なるトラッキングピクセルです。あなたは、type="button"はページとiframeコードが同じドメインからのものであれば、フォーム

に提出しないことが必須である

<iframe id='conversioniFrame' data-src="testFrame.html" 
     src="about:blank" width='100px' height="100px"> 
<div class='panel clearfix'> 
    <form id="options-go-to-insurer" action="/life/buy/" method="post"> 
     <!-- Form stuff --> 
    </form> 
    <button id="conversionButton" class="button primary expand apply-button" onclick="conversionFunction(submitForm())"><b>Apply Now</b></button> 
</div> 


<!-- STOP --> 
<script> 

function conversionFunction(callback) { 
    var iframe = $("#conversioniFrame"); 
    iframe.attr("src", iframe.data("src")); 
    callback(); 
} 

function submitForm() { 
    document.getElementById("options-go-to-insurer").submit(); 
} 
</script> 

Answer 1

注：

以下のコードを（動作しない）を見つけるしてくださいただtestIframe.html

から

<script>parent.document.getElementById("options-go-to-insure‌​r").submit()</script‌​>

を返すことができます

ない場合は、ご返信のために、この

$(function() { 
 
    $("#conversionButton").on("click", function() { // when button is clicked 
 
    var $tracker = $("#conversioniFrame"); 
 
    $tracker.attr("src", $tracker.data("src")); // load the page 
 
    }); 
 
    $("#conversioniFrame").on("load", function() { // when page has loaded 
 
    $("#options-go-to-insurer").submit(); // submit the form 
 
    }); 
 
});

<iframe id='conversioniFrame' data-src="testFrame.html" src="about:blank" width='100px' height="100px"> 
 
    <div class='panel clearfix'> 
 
    <form id="options-go-to-insurer" action="/life/buy/" method="post"> 
 
     <!-- Form stuff --> 
 
    </form> 
 
    <button type="button" id="conversionButton" class="button primary expand apply-button"><b>Apply Now</b> 
 
    </button> 
 
    </div>