javascript - IE 中的 jQuery UI 对话框和 Flash

Question

我一直在尝试获取 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 也无济于事。不过，我觉得我真的很接近......

Answer 1

好的，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 中的偏移量是错误的。我的错。