尝试在Knockout中使用ZClip

Question

我试图创建一个使用Knockoutjs动态加载文本的网站，我希望用户能够点击并将其复制到他们的剪贴板上。对于复制到剪贴板的功能，我使用兹卡姆，在静态加载文本时让它工作。

在我的ViewModel中，我有一个函数copyFunction，如下所示：

self.copyFunction = function(html) {
    console.log(html);
    $('#copytext').zclip({
        path: "http://www.steamdev.com/zclip/js/ZeroClipboard.swf",
        copy: function() {
            return $('#copytext').text();
        }
    });
}

只要在网页上单击其中一项，就会调用此选项。

在我的HTML中，我为我拥有的每一项动态生成了这类内容：

<div class="row" data-bind="foreach: itemList">
        <div class="col-xs-3 text-center">
            <a data-bind="click: $parent.copyFunction, text: text" href="#" id="copytext"></a>
        </div>
</div>

我知道我的copyFunction是不正确的，但我不知道我需要做什么才能让它为我工作。理想情况下，我希望将ZClip应用于调用它的<a>标记，但我不知道如何实现这一点。

我以前使用过ZClip的唯一方法是最著名的示例:在HTML中设置id和使用jQuery事件处理程序。但是，我也不能让它工作，因为我对JS还不熟悉，而且我非常肯定，当我的jQuery函数是的时候，id并没有被完全加载，因此它不能正确地链接到DOM。

如果你能帮我了解一下我是如何工作的，我会非常感激的。

Answer 1

通过将event作为参数传递给函数，解决了我的问题。

下面是这个函数现在的样子：

self.copyFunction = function(html, event) {
    var target = event.target;
    $(target).zclip({
        path: "http://www.steamdev.com/zclip/js/ZeroClipboard.swf",
        copy: function() {
            return $(target).text();    
        }
    });
}

我的另一个怪癖是只有当我把网站上传到我的服务器上，而不是从我的本地主机上的时候，Z剪辑才能工作。有人知道为什么会发生这种事吗？