从jQuery UI对话框中的按钮调用动态创建的iFrame中的函数 [英] Calling function in dynamically created iFrame, from button in jQuery UI dialog
问题描述
摘要:
使用jQuery UI对话框和动态创建的 iFrame
,是否可以从 .dialog
Using jQuery UI dialogs and a dynamically created iFrame
, is it possible to call a function inside the iFrame
from one of the buttons defined in the .dialog
详细信息:
我只是刚开始用jQuery和jQuery UI开始,我正在尝试将现有的应用程序转换为使用 .dialog
功能。
I'm only just starting to cut my teeth with jQuery and jQuery UI, and I am trying to convert an existing application over to using the .dialog
functionality.
我之前使用的插件用于内联弹出窗口很好,但是jQuery不能与它共存他们都使用 $()
方法。我知道你可以避免与其他图书馆的冲突,但我认为移动到jQuery lock-stock-and-barrel更容易,而不是让它们共存。
The previous plugin that I was using for "inline popup windows" was good, but jQuery cannot co-exist with it as they both use the $()
method. I am aware you can avoid conflicts with other libraries, but I thought it was easier to move over to jQuery lock-stock-and-barrel, rather than make them co-exist.
上一个插件的优点是能够将弹出窗口的内容指定为页面上的现有< div>
,将HTML代码或(最重要的是)我的URL指定为不同页面。
The advantage of the previous plugin was the ability to specify the content of the popup to be either an existing <div>
on the page, direct HTML code or (most importantly to me) the URL to a different page.
这个答案真的对我有帮助这些能力有效,这就是我现在所拥有的...
This answer really helped me get the last of those abilities working, and this is what I currently have...
$(document).ready(function () {
var iframe = $('<iframe id="myFrame" width="100%" height="100%" frameborder="0" marginwidth="0" marginheight="0"></iframe>');
var dialog = $('<div id="myDiv"></div>').append(iframe).appendTo("body").dialog({
autoOpen: false,
modal: true,
resizable: true,
width: 600,
height: 600,
title: "My Popup",
close: function () {
iframe.attr("src", "");
},
buttons: [{ text: "Call iFrame Function",
click: function () { alert($("#myFrame").contentWindow); }
},
{ text: "Close Popup",
click: function () { $("#myDiv").dialog("close"); }
}]
});
iframe.attr({ src: "SubPage.html" });
dialog.dialog("open");
});
我无法解决的问题是......
如何在jQuery动态创建的iFrame中运行javascript,点击按钮?
How can I run javascript in the iFrame that has been created dynamically by the jQuery, via a button click??
为什么是 $(#myFrame)中的
始终 .contentWindow
.contentWindow undefined
? (我可以确认 $(#myFrame)
返回有问题的iframe。)
Why is the .contentWindow
in $("#myFrame").contentWindow
always undefined
? (I can confirm that $("#myFrame")
returns the iframe in question.)
推荐答案
编辑: $(#myFrame)。contentWindow未定义的原因是由iframe元素组成的jQuery对象没有contentWindow属性。你需要得到(0)来获得实际的窗口元素,你可以在其上调用该命名空间中定义的Javascript函数。
The reason $("#myFrame").contentWindow is undefined is that the jQuery object consisting of the iframe element does not have a contentWindow property. You need to get(0) on it to get the actual window element, on which you can call Javascript functions defined in that namespace.
$("#myFrame").get(0).contentWindow.myFunction(args);
要遍历和操作其DOM,请使用此方法获取iframe的内容文档:
To traverse and manipulate its DOM, use this to get your iframe's content document:
var framedoc = $("#myFrame").get(0).contentDocument || $("#myFrame").get(0).contentWindow.document;
然后你应该像普通文件一样操纵它,例如
Then you should be able to manipulate it like a normal document, e.g.
$(framedoc).find("input#whatever").val(myInput).closest("form").submit()
或者你想要触发的是什么。
Or whatever it is you're wanting to trigger.
这篇关于从jQuery UI对话框中的按钮调用动态创建的iFrame中的函数的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!