Question

正在创建一个jquery模式对话框并将其链接到另一个页面中的表单，如下所示：

var $dialog = $("<div></div>")
.html('<iframe style="border: 0px; " src="' + page + '" width="100%" height="100%"></iframe>')
.dialog({
   autoOpen: false,
   modal: true,
   height: 400,
   width: 300,
   title: "Multiple HAWBs",
   buttons: {
        "Save": function() {
            $( this ).dialog( "close" );
        },
        "Cancel": function() {
            $( this ).dialog( "close" );
        }
    },
    close: function() {}
});
$dialog.dialog('open');
});

链接页面上的

我有一个元素，我试图从对话框中读取选定的值到我的父页面，我该怎么做？

Answer 1

如果iframe的来源是不同的域名，则无法执行此操作。在其他情况下，您可以通过向该元素添加ID来访问其内容

<iframe id="myiframe" style="border: 0px; " src="' + page + '" width="100%" height="100%"></iframe>'

然后简单地

document.getElementById('myiframe').contentWindow.document

Answer 2

看看这是否是您需要的：HERE

<强> demo.php

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>

<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css" />
<script>
$(document).ready(function(){
$(".click").on('click',function(){
    myDialog();
});
});
function myDialog(){
var $dialog = $("<div></div>")
.html('<iframe style="border: 0px;" id="frame" src="view1.php" width="100%" height="100%"></iframe>')
.dialog({
    autoOpen: false,
    modal: true,
    height: 400,
    width: 300,
    title: "Multiple HAWBs",
    buttons: {
         "Save": function() {
             var data="";
            var childrens= $($(document.getElementById('frame').contentWindow.document)[0].activeElement).children();//get allthe fields of dialog
         childrens.each(function(index){
     if(childrens[index].id == 'addme1'){
        data=data+childrens[index].value;//this is just to show you the reading of content of dialog.
        }

         })
             $( this ).empty();
            $("#parent").html(data);

             $( this ).dialog( "close" );
         },
         "Cancel": function() {
             $( this ).dialog( "close" );
         }
     },
     close: function() {

     }
});
$dialog.dialog('open');

}
</script>

<div>
<div id="parent">i'll be changed using dialog data</div>
<button class="click">Open Dialog</button>

<强> view1.php

<input type="text" id="addme">
<input type="text" id="addme1">

来自jquery模式对话框的返回值帽子链接到另一页面

2 个答案: