Question

在我的网站上，我有一个发布到iframe的表单，父目标和iframe窗口都在我的页面，域等上。

<iframe id="ifc1" style="display:none;" name="ifc"></iframe>

<div id="couponbox">
<form enctype="multipart/form-data" id="promo-form" class="form-inline" action="" method="post" target="ifc">
    <div class="form-group">            
        <input type="text" name="..." placeholder="Enter Here" id="..." class="form-control" value="">
    </div>
    <div class="form-group">
        <input type="submit" class="btn btn-primary" value="Apply Now" placeholder="">
    </div>
</form>
</div>

表单已成功发布，并且在iframe页面上有一个显示警报/结果的div。

<div id="alert" class="alert alert-success">.....</div>

我正在尝试使用JS或Jquery来查找警报中显示的文本（即失败，成功等），然后在父页面上回显消息。

// Attempt at a supposed solution 

// reference to iframe with id 'ifrm'
var ifrm = document.getElementById('ifc1');
var base = document.getElementById('couponbox');
// using reference to iframe (ifrm) obtained above
var win = ifrm.contentWindow; // reference to iframe's window
// reference to document in iframe
var doc = ifrm.contentDocument? ifrm.contentDocument: ifrm.contentWindow.document;
// reference to form named 'demoForm' in iframe
var form = doc.getElementById('alert');

if (form === "Credits successfully deposited into your account") {
// Tried jQuery 
$('#couponbox').append('success')
}

// jQuery attempt
if($("#ifc1").contents().text().search("successfully deposited")!=-1){
    alert("found");
}

到目前为止，我还没有能够得到任何工作。任何帮助表示赞赏。

更新 -

我目前正在尝试使用此代码 -

$('#ifc1').on('load', function() {

if($.trim($("#ifc1").contents().find("#alert").html()) === "Credits successfully deposited into your account"){
       $("#couponbox").prepend("<b>Successfully Deposited</b>");
$("#buy").replaceWith( '<input type="submit" value="Publish" name="upsub" id="upsub" class="pubbtn action-button" placeholder="">' 

  } else {
$("#ifc1").contents().find("#alert").appendTo("#couponbox");
}
});

我已将它放在页面的末尾。它虽然给了我其他脚本的错误。

注释掉replacewith函数，不会给出循环错误---

$('#ifc1').on('load', function() {

if($.trim($("#ifc1").contents().find("#alert").html()) === "Credits successfully deposited into your account"){
       $("#couponbox").prepend("<b>Successfully Deposited</b>");
//$("#buy").replaceWith( '<input type="submit" value="Publish" name="upsub" id="upsub" class="pubbtn action-button" placeholder="">' 

  } else {
$("#couponbox").prepend("<b>Incorrect</b>");
}
});

Answer 1

您正在尝试获取表单元素的内容，但您没有使用innerHTML。

var ifrm = document.getElementById('ifc1');
var base = document.getElementById('couponbox');
var win = ifrm.contentWindow; // reference to iframe's window
var doc = ifrm.contentDocument? ifrm.contentDocument: ifrm.contentWindow.document;
var form = doc.getElementById('alert');

if (form.innerHTML.includes("Credits successfully deposited into your account")) {
$('#couponbox').append('success')
}

Answer 2

要从iframe获取#alert div的文字，您可以使用

$(document).ready(function(){
  $("#ifc1").contents().find("form#promo-form").on("submit",function(){
      alert($("#ifc1").contents().find("#alert").html());
  });    
});

它将为您提供#alert div。

中的文字

更新

$('#ifc1').on('load', function() {
     alert($("#ifc1").contents().find("#alert").html());
});

当您在iframe中提交表单时，它也会触发iframe的加载事件。检查您是否可以获得加载功能的值？

更新2

    $('#ifc1').on('load', function() {
         if($.trim($("#ifc1").contents().find("#alert").html()) === "success"){
            alert("finish");
         }
    });

您可以使用$ .trim删除字符串周围的所有空格，并检查它是否与＆＃34; success＆＃34;匹配。 TRIM

将表单发布到父页面上的iframe和echo结果文本

2 个答案:

更新

更新2