使用JavaScript在父窗口中打开iFrame表单成功

Question

我们目前正在使用JavaScript来处理表单，但表单包含在iFrame中，iFrame会在iFrame中打开成功结果URL。我们希望成功结果（一旦填写表格）指向父框架......

表单脚本：

<script>try
{
var lastSubmission = null;
var ContactId = 0; var _wow;
var CaptureId = 12;
var PageId = 0;
var EmailId = 0;
var CampaignName = '';
var IsNewContact = false;
var IsTest = false;
var IsUserValid;
var gatorLeadsTrackingOptions = 0;
}catch(e){}
errorMessage.innerHTML ='';
successMessage.innerHTML ='';
function GatorTrim(x) { return x.replace(/^\s+|\s+$/gm,'');};function CaptureFormData()
{
if(lastSubmission != null){
 secondsSinceLastSubmission = (new Date().getTime() - lastSubmission) / 1000
 if(secondsSinceLastSubmission < 1) {
     return;
 }
}
var Value;
var CheckSelection = false;
var result;
var ButtonId = 6;
var submissionData = {
 captureId: CaptureId,
 buttonId: ButtonId,
 pageId: PageId,
 emailId: EmailId,
 campaignName: CampaignName,
 contactId: ContactId,
 isTest: IsTest,
 sendNotificationEmail: false,
 passGatorLeadsTrackingDataInRedirectUrl: true,
 onlyOneEntry: false,
 displayName: 'Volo Not got a code',
 emailAddress: '',
 values: [],
 gatorLeadsTrackingOptions: gatorLeadsTrackingOptions
};
document.getElementById('CaptureControlButton_6_').disabled = true;
document.getElementById('CaptureControlButton_6_').value = 'Submitting, please wait';
setTimeout(function() {try{errorMessage.innerHTML = '';
successMessage.innerHTML = '';
Value = getObject('CaptureControl_4_').value;
if(Value==''){errorMessage.innerHTML += 'The email address field is missing<br>';
document.getElementById('CaptureControlButton_6_').disabled = false;
document.getElementById('CaptureControlButton_6_').value = 'Send';
}
Value = getObject('CaptureControl_5_').value;
if(Value==''){errorMessage.innerHTML += 'Mandatory fields missing<br>';
document.getElementById('CaptureControlButton_6_').disabled = false;
document.getElementById('CaptureControlButton_6_').value = 'Send';
}
Value = getObject('CaptureControl_3_').value;
if(Value==''){errorMessage.innerHTML += 'The field name company name is missing<br>';
document.getElementById('CaptureControlButton_6_').disabled = false;
document.getElementById('CaptureControlButton_6_').value = 'Send';
}
if(errorMessage.innerHTML != ''){return;}
Value = GatorTrim(getObject('CaptureControl_4_').value);
submissionData.emailAddress = Value;


Value = GatorTrim(getObject('CaptureControl_5_').value);
if (Value != undefined) {submissionData.values.push({controlId: 5, value: Value });
}


Value = GatorTrim(getObject('CaptureControl_6_').value);
if (Value != undefined) {submissionData.values.push({controlId: 6, value: Value });
}


Value = GatorTrim(getObject('CaptureControl_3_').value);
if (Value != undefined) {submissionData.values.push({controlId: 3, value: Value });
}


var result = WebCapture.Submit(JSON.stringify(submissionData));
var response = JSON.parse(result.value);
if(response.success==false){errorMessage.innerHTML = 'You have already submitted.';
document.getElementById('CaptureControlButton_6_').disabled = false;
document.getElementById('CaptureControlButton_6_').value = 'Send';
return;}
trackingData = response.trackingData;
document.getElementById('CaptureControlButton_6_').disabled = false;
document.getElementById('CaptureControlButton_6_').value = 'Send';
successMessage.innerHTML = 'Thank you for submitting&nbsp;';
if(typeof _wow != 'undefined' && response.trackWowSubmit){
 trackUrlInWow(response.wowUrl);}
var submitRedirectUrl = 'http://takeflight.volocommerce.com/multichannel-selling/'
if(submitRedirectUrl.indexOf('?') == -1){
 submitRedirectUrl = submitRedirectUrl + '?';
}else{
 submitRedirectUrl = submitRedirectUrl + '&';
}

submitRedirectUrl += 'gator_td=' + trackingData;
window.location.href=submitRedirectUrl;
}catch(e){if(IsTest) { alert(e.message); } else { alert('An error has occurred submitting the data. Please try again.'); } 
document.getElementById('CaptureControlButton_6_').disabled = false;
document.getElementById('CaptureControlButton_6_').value = 'Send';
}
lastSubmission = new Date().getTime();
}, 100);

}</script>

表单（包含在我们页面上的iframe中）

<style>
body {
background: #fff;
color:#000;
font-family: ‘open sans’, sans-serif;
}
input[type=text], input[type=button] {
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 5px;
height: 40px;
border: 1px solid #f1f1f1;
}
input[type=button] {
background-color: #F04D1D;
height: 45px;
font-weight: bold;
color: #FFF;
font-size: 16px;
}
</style>
<table style="width: 300px; background-color: rgb(255, 255, 255);"><base target="_parent" />
    <tbody>
        <tr>
            <td style="text-align: center;"><font color="#f04d1d"><strong><span style="font-family: '‘open sans’', sans-serif, ';'; font-size: 24px;">GET YOUR CODE&nbsp;</span></strong></font></td>
        </tr>
        <tr>
            <td><span style="color: rgb(242, 242, 242);">&nbsp;</span></td>
        </tr>
        <tr>
            <td><br>
            </td>
        </tr>
        <tr>
            <td>
            <table>
                <tbody>
                    <tr>
                        <td>First Name*&nbsp;</td>
                        <td><span style="color: rgb(0, 0, 0);">Last Name*</span></td>
                    </tr>
                    <tr>
                        <td><input name="First Name" id="CaptureControl_5_" type="text" value=""></td>
                        <td><input name="Last Name" id="CaptureControl_6_" type="text" value=""></td>
                    </tr>
                </tbody>
            </table>
            </td>
        </tr>
        <tr>
            <td><br>
            </td>
        </tr>
        <tr>
            <td><span style="color: rgb(0, 0, 0);">&nbsp;</span><span style="color: rgb(0, 0, 0);">Company Name*</span></td>
        </tr>
        <tr>
            <td><input name="Company Name" id="CaptureControl_3_" type="text" value="" style="width: 300px;"></td>
        </tr>
        <tr>
            <td><br>
            </td>
        </tr>
        <tr>
            <td><span style="color: rgb(0, 0, 0);">&nbsp;</span><span style="color: rgb(0, 0, 0);">Your Email*</span></td>
        </tr>
        <tr>
            <td><input name="Email Address" id="CaptureControl_4_" type="text" value="" style="width: 300px;"><br>
            </td>
        </tr>
        <tr>
            <td><span style="color: rgb(242, 242, 242);">&nbsp;</span></td>
        </tr>
        <tr>
            <td><input id="CaptureControlButton_6_" type="button" value="Send" onclick="try{CaptureFormData(0);}catch(e){}" style="width: 300px;"><br>
            <div id="errorMessage" style="width:135;height:10;font-family:Verdana;font-size:8pt;color:red;">Error Message Area</div>
            <div id="successMessage" style="width:135;height:10;font-family:Verdana;font-size:8pt;color:#000000;">Success Message Area</div>
            </td>
        </tr>
        <tr>
            <td><span style="color: rgb(0, 0, 0); font-size: 10px;"><em>*Required field</em></span></td>
        </tr>
    </tbody>
</table>
<br>
<br>

注意表单位于与我们的主网站不同的URL /域上，其中包含内容。

Answer 1

只需使用window.top.location更改整个页面，而不仅仅是iframe部分。