Javascript 将aloha注入iframe
我正在尝试将aloha注入到加载了Javascript 将aloha注入iframe,javascript,jquery,iframe,javascript-injection,aloha,Javascript,Jquery,Iframe,Javascript Injection,Aloha,我正在尝试将aloha注入到加载了iframe的页面中。这是我的头标记的内部html: <title>Getting Started with Aloha Editor</title> <link rel="stylesheet" href="/Styles/aloha.css" /> <script src="/Scripts/aloha/require.js"></script> <script src="/Scripts/a
iframe
的页面中。这是我的头
标记的内部html:
<title>Getting Started with Aloha Editor</title>
<link rel="stylesheet" href="/Styles/aloha.css" />
<script src="/Scripts/aloha/require.js"></script>
<script src="/Scripts/aloha/aloha.js" data-aloha-plugins="common/ui,common/format,common/highlighteditables,common/link,common/image"></script>
<script type="text/javascript">
$(function () {
$("#email-template").load(function () {
var link = this.contentWindow.document.createElement("link");
link.rel = "stylesheet";
link.href = "/Styles/aloha.css";
this.contentWindow.document.body.appendChild(link);
var script = this.contentWindow.document.createElement("script");
script.type = "text/javascript";
script.src = "/Scripts/aloha/require.js";
this.contentWindow.document.body.appendChild(script);
script = this.contentWindow.document.createElement("script");
script.type = "text/javascript";
script.src = "/Scripts/aloha/aloha.js";
script["data-aloha-plugins"] = "common/ui,common/format,common/highlighteditables,common/link,common/image";
this.contentWindow.document.body.appendChild(script);
script = this.contentWindow.document.createElement("script");
script.type = "text/javascript";
script.innerHTML = '$(function() {Aloha.ready(function() {Aloha.jQuery(".editable-content").aloha();})});';
this.contentWindow.document.body.appendChild(script);
});
});
</script>
<div id="main">
<table>
<thead>
<tr>
<th>Name</th>
<th>Value</th>
</tr>
</thead>
<tbody>
<tr>
<td>From</td>
<td><strong>a@b.c</strong></td>
</tr>
<tr>
<td>To</td>
<td><strong class="editable-content">d@e.f</strong></td>
</tr>
<tr>
<td>CC</td>
<td><strong class="editable-content">g@h.i</strong></td>
</tr>
<tr>
<td>Subject</td>
<td><strong>Please read this (not) really important email</strong></td>
</tr>
<tr>
<td>Content</td>
<td><iframe id="email-template" src="<%= ResolveUrl("~/Forms/Integration/Remedy/SandboxAlohaInner.aspx") %>"></iframe></td>
</tr>
</tbody>
</table>
</div>
<script type="text/javascript">
Aloha.ready( function() {
Aloha.jQuery('.editable-content').aloha();
});
</script>
<asp:Button ID="Send" runat="server" Text="Send" />
外部页面上一切正常,但iframe内部的页面无法识别Aloha变量。为什么?
错误消息如下所示:
未捕获引用错误:未定义Aloha
我已经解决了这个问题。问题是,当我试图访问Aloha变量时,它还没有被创建。解决方案是一种非常丑陋的黑客行为:
script.innerHTML = 'var alohaInterval = setInterval(function() {if (typeof Aloha === "undefined") {return;} clearInterval(alohaInterval); Aloha.ready(function() {Aloha.jQuery(".editable-content").aloha();})}, 100);';
而不是头中显示的加载
事件中的倒数第二行