我一直在尝试获取 Zero Clipboard和 jQuery UI Dialog一起玩得很好,事实证明这是相当困难的。
零剪贴板允许通过在按钮上放置透明的 Flash 影片从 Javascript 复制到剪贴板,以便用户在尝试单击按钮时单击 Flash。正如您在 demo page 中看到的那样,这很好地跨浏览器工作。 .
但是,当尝试在 jQuery UI 对话框中使用它时,似乎出了点问题。
首先,我发现flash元素必须放在dialog元素内部,否则Chrome和IE拒绝响应点击事件。这意味着我不能使用 glue
便捷方法,但没关系。
但是,由于某些原因,现在 IE 不接受 Flash 元素上的 setText
方法。
我所做的一个例子是 here .我的代码从第 300 行开始,最相关的行是:
$("#showme").dialog({autoOpen: false, width: 550, height: 200});
$("#showme").bind("dialogopen", function() {
if($("#clipflash").length == 0) {
var btn = $("#d_clip_button");
$("<div id='clipflash' style='position:absolute; background: #f00; z-index: 9999' />")
.css(btn.position())
.width(btn.width())
.height(btn.height())
.html(clip.getHTML(btn.width(), btn.height()))
.appendTo("#showme");
}
});
为了安全起见,我将 div 涂成红色以便更容易发现并将其 z-index 设置为 9999。然后我设置位置和大小以覆盖“按钮”,并使用 clip.getHTML()
添加 Flash 元素的 HTML。
我已经为此工作了几个小时,所以非常感谢任何帮助。
差点忘了:我的问题是 IE7 在零剪贴板代码中说“对象不支持此属性或方法”。
更新
powtac 的评论指出了一些看起来很有前途的事情:
I forgot the own golden rule: In order for the Flash ExternalInterface to work in IE 7, you have to stuff the EMBED/OBJECT HTML into the DIV element AFTER it gets appended to the DOM. Stupid IE.
但是,切换行 .html(clip.getHTML(btn.width(), btn.height()))
和 .appendTo("#showme")
没有帮助。即使为以后添加 Flash HTML 而执行 setTimeout
也无济于事。不过,我觉得我真的很接近......
最佳答案
好的,powtac 确实为我指出了正确的方向,但缺少一个元素:使用 jQuery html()
函数与简单设置 innerHTML< 的效果不同
。如果有人能解释原因就好了。
因此,固定代码如下所示:
$("#showme").bind("dialogopen", function() {
if($("#clipflash").length == 0) {
var btn = $("#d_clip_button");
$("<div id='clipflash' style='position:absolute; background: #f00; z-index: 9999' />")
.css(btn.position())
.width(btn.width())
.height(btn.height())
.appendTo("#showme")
[0].innerHTML = clip.getHTML(btn.width(), btn.height());
}
});
另外,我忘记在示例页面中放入 DOCTYPE,所以在 IE 中的偏移量是错误的。我的错。
关于javascript - IE 中的 jQuery UI 对话框和 Flash,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1537443/