Javascript zeroclipboard元素位于辅助/非默认jQuery选项卡内时不工作

我有一个带有jQuery选项卡的页面，我正在尝试将辅助选项卡中的div元素链接到zeroclipboard。不幸的是，它不起作用，因为我怀疑在加载页面时，辅助选项卡最初是隐藏的

html如下所示：

<span id="form" class="tabs tabs-normal grid100">

   <!-- HEADER BUTTONS -->
   <div class="row_btns_header">
      <button class="btn_neutral">Cancel</button>
      <button class="btn_primary last save">Save</button>     
   </div>

   <!-- TABS -->
   <div class="row">
      <ul id="tabs-list">
        <li><a href="#blog">Blog</a></li>
        <li><a href="#links">Links</a></li>
        <li><a href="#images">Images</a></li>
        <li><a href="#more">More..</a></li>
      </ul>
   </div>

   <!-- DEFAULT TAB -->
   <div id="blog" class="container">

   </div>

   <!-- LINKS TAB -->
   <div id="links" class="container">
        <div id="embed" style="position: relative">
           <a href="#">Copy into the clipboard</a>
        </div>
   </div>

   <!-- etc. -->

如果我将#embed div移动到#blog div中，zeroclipboard工作正常。我怀疑这是因为#blog默认可见

当zeroclipboard元素位于辅助非默认选项卡中时，我需要做些什么才能让它正常工作

非常感谢

---

Bardi

选项卡插件将选项卡面板设置为显示：无，这意味着闪存无法立即启动。您可以尝试使用CSS对其进行黑客攻击：

.container.ui-helper-hidden {
    display: block !important;
    position: absolute;
    left: -99999px;
}

---

这将覆盖

显示：无

，而是将面板定位在屏幕外-这样可以加载内容并测量面板，但用户看不到。（这与

.ui helper hidden accessible

过去的工作方式相同）

选项卡插件将选项卡面板设置为

显示：无

，这意味着闪存不会立即启动。您可以尝试使用CSS对其进行黑客攻击：

.container.ui-helper-hidden {
    display: block !important;
    position: absolute;
    left: -99999px;
}

---

这将覆盖

显示：无

，而是将面板定位在屏幕外-这样可以加载内容并测量面板，但用户看不到。（这与

.ui helper hidden accessible

过去的工作方式相同）

我意识到这是一个旧线程，但希望这能帮助其他人

我也遇到了同样的问题，我提出的解决方案是将zclip对象的创建绑定到与所需触发器按钮/链接关联的mouseover事件。另外，为了防止每次发生mouseover事件时脚本重新初始化zclip对象，只需在第一次调用它时将其关闭即可。下面是一个例子：

HTML：

<input type='text' value='Text being copied.'/> <input type='button' class='clipcopy' value='Copy'/>

---

希望有帮助

我意识到这是一条古老的线索，但希望这能帮助其他人

我也遇到了同样的问题，我提出的解决方案是将zclip对象的创建绑定到与所需触发器按钮/链接关联的mouseover事件。另外，为了防止每次发生mouseover事件时脚本重新初始化zclip对象，只需在第一次调用它时将其关闭即可。下面是一个例子：

HTML：

<input type='text' value='Text being copied.'/> <input type='button' class='clipcopy' value='Copy'/>

---

希望有帮助

关键是在鼠标悬停事件中初始化它，我正在使用，这也可以工作

$("a.button-copy-shortcode").on('mouseover', function(event){
    event.preventDefault();

    //initialize clipboard
    $(this).clipboard({
        path: pluginDir+'/tonjoo-tom/assets/js/jquery.clipboard.swf',
        copy: function() {

            var shortcode = $(this).find('.shortcodeValue').text();

            return shortcode;
        }
    });
});

---

关键是在mouseover事件上初始化它，我正在使用它，这也可以工作

$("a.button-copy-shortcode").on('mouseover', function(event){
    event.preventDefault();

    //initialize clipboard
    $(this).clipboard({
        path: pluginDir+'/tonjoo-tom/assets/js/jquery.clipboard.swf',
        copy: function() {

            var shortcode = $(this).find('.shortcodeValue').text();

            return shortcode;
        }
    });
});

---

谢谢你的回复。我使用Chrome的代码检查器查看了代码，没有看到任何选项卡被分配。ui帮助隐藏。相反，我看到了隐藏的.ui选项卡，我将其更改为上面的：.container.ui-tabs-hide{display:block！important；position:absolute；left:-9999px；}这很不幸没有起作用。只有当我删除“left”属性，导致选项卡相互重叠时，zeroclipboard才在我单击“复制到剪贴板”链接时起作用。实际上，它似乎起作用，但似乎需要一段时间（至少15-20秒，有时甚至长达一分钟）才能将嵌入替换为swf Flash文件？我已将.swf文件的路径替换为我自己服务器上的路径，但没有效果。如果它默认位于第一个选项卡中，则不会出现这种情况。感谢您的回复。我使用Chrome的代码检查器查看了代码，没有看到任何选项卡被分配。ui帮助隐藏。相反，我看到了隐藏的.ui选项卡，我将其更改为上面的：.container.ui-tabs-hide{display:block！important；position:absolute；left:-9999px；}这很不幸没有起作用。只有当我删除“left”属性，导致选项卡相互重叠时，zeroclipboard才在我单击“复制到剪贴板”链接时起作用。实际上，它似乎起作用，但似乎需要一段时间（至少15-20秒，有时甚至长达一分钟）才能将嵌入替换为swf Flash文件？我已将.swf文件的路径替换为我自己服务器上的路径，但没有效果。如果它默认位于第一个选项卡中，则不会出现这种情况。非常感谢你，伙计。。。它完全奏效了。。我正要失去希望时，这终于为我工作了…谢谢你这么多人。。。它完全奏效了。。我正要失去希望时，这终于对我起了作用。。。